输入文字长度 + 指定标签的长度 (判断长度并提示)
< div style = "position: relative;" class = 'changyongyu' > < el-input type = "textarea" :autosize= "{ minRows: 8, maxRows: 8 }" style = "margin-bottom:10px;" v-model.trim= "ruleForm.content" maxlength = "500" @input= "inputchangyongyu" @change= "inputchangyongyu" @paste.native.capture.prevent= "handleFalse" > < /el-input> < div style = "position: absolute;right: 10px;bottom: -10px;" > { { textlength > 500 ? '500' : textlength } } / 50 0 < /div> < /div> // 计算长度字段属性添加 开始computed: { textlength ( ) { // // // let num_store_name = 0 let num_store_addr = 0 let num_store_phone = 0 let mintextlength = 0 // 门店名称 : 25 个字段 门店地址 :50个字段, 电话:15个字段 num_store_name = ( this.ruleForm.content.match( /num_store_addr = ( this.ruleForm.content.match( /num_store_phone = ( this.ruleForm.content.match( /mintextlength = this.ruleForm.content.replace( /let num = num_store_phone + num_store_addr + num_store_namereturn num + mintextlength.length} } ,// 计算属性结束inputchangyongyu( val) { if ( this.textlength > 500 ) { this.$message .warning( ` 总字数超出了长度!请精简字数` ) ; this.ruleForm.content = val.slice( 0 , -1) ; return val; } } ,//方法handleFalse( e) { let clip = e.clipboardData.getData( 'Text' ) ; let num = this.textlength + clip.lengthif( num > 500 ) { this.$message .warning( ` 粘贴字数超出了长度!请精简字数` ) ; return true ; } else{ this.ruleForm.content += String( clip) } //终止} ,//添加标签进行判断labeladd( val) { const _this = thislet textname = '' let num = 0 // 门店名称 : 25 个字段 门店地址 :50个字段, 电话:15个字段 if ( val == '#{store_name}' ) { textname = '门店名称' num = _this.textlength + 25 } else if ( val == '#{store_phone}' ) { textname = '门店电话' num = _this.textlength + 15 } else if ( val == '#{store_addr}' ) { textname = '门店地址' num = _this.textlength + 50 } if ( num > = 500 ) { this.$message .warning( ` 插入${ textname} 后,总字数超出了常用语长度!请精简常用语的字数,再插入${ textname} ` ) ; return ; } else { _this.changyongyutext += String( val) } } ,