123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127 |
- <template>
- <view class="container">
- <view class="content">
- <textarea v-model="remarks" maxlength="50" @input='setLength' placeholder="如您有特殊需求,请备注告知" />
- <view class="contentSize">
- 限制字数{{num}}/50
- </view>
- </view>
- <view class="sub-btn" :style="{'background-color':setColor}" @click="onSubmit">完成</view>
- </view>
- </template>
- <script>
-
- /*
- * param str 要截取的字符串
- * param L 要截取的字节长度,注意是字节不是字符,一个汉字两个字节
- * return 截取后的字符串
- */
- function cutStr(str,L){
- var result = '',
- strlen = str.length, // 字符串长度
- chrlen = str.replace(/[^\x00-\xff]/g,'**').length; // 字节长度
-
- if(chrlen<=L){return str;}
-
- for(var i=0,j=0;i<strlen;i++){
- var chr = str.charAt(i);
- if(/[\x00-\xff]/.test(chr)){
- j++; // ascii码为0-255,一个字符就是一个字节的长度
- }else{
- j+=2; // ascii码为0-255以外,一个字符就是两个字节的长度
- }
- if(j<=L){ // 当加上当前字符以后,如果总字节长度小于等于L,则将当前字符真实的+在result后
- result += chr;
- }else{ // 反之则说明result已经是不拆分字符的情况下最接近L的值了,直接返回
- return result;
- }
- }
- }
-
- export default {
- data() {
- return {
- remarks: "",
- setColor: "",
- num: 0,
- }
- },
- onLoad(options) {
- uni.setNavigationBarColor({
- frontColor: '#ffffff',
- backgroundColor: this.$store.state.color,
- })
- this.remarks = options.remarks;
- this.num = options.remarks.length;
- this.setColor = this.$store.state.color;
- },
-
- methods: {
- setLength(e) {
- this.num = this.remarks.length;
- if (this.num >= 50) {
- this.num =50;
- uni.showToast({
- icon: 'none',
- title: '最多只能輸入50個字'
- });
- }
- },
- onSubmit() {
-
- let remarks =cutStr(this.remarks,100)
- console.log(remarks,"remarks")
- let pageList = getCurrentPages()
- if (pageList.length > 1) {
- let prePage = pageList[pageList.length - 2]
- console.log(prePage)
- prePage.$vm.remarks = remarks
- uni.navigateBack()
- }
- }
- },
- }
- </script>
- <style lang="scss">
- page {
- background: #eee;
- }
- .container {
- padding: 30rpx;
- }
- .content {
- width: 100%;
- height: 376rpx;
- background-color: #fff;
- border-radius: 20rpx;
- padding: 20rpx;
- box-sizing: border-box;
- font-size: 30rpx;
- }
- .content textarea {
- width: 100%;
- height: 300rpx;
- }
- .contentSize {
- font-size: 28rpx;
- color: #999;
- text-align: right;
- }
- .sub-btn {
- height: 100rpx;
- background-color: $theme-color;
- text-align: center;
- line-height: 100rpx;
- font-size: 36rpx;
- color: #fff;
- border-radius: 10rpx;
- margin-top: 40rpx;
- }
- </style>
|