vue 重写element input限制字数

在使用element时，提供了限制字数的属性

 

<el-input v-model="form.campaignName" size="medium" style="width: 250px;" show-word-limit maxlength="150"></el-input>

但是会发现，提示不管你输入啥都是按照一次字符算的。

在开发头条的接口中，提示一个汉字占2个字符，所以要重写

------------------------------------------------------------------------

 

 

<el-input v-model="form.campaignName" size="medium" style="width: 250px;" maxlength="100" @input="campaignNameInput"></el-input>
          <span class="gray"> 字数限制:{{campaignNameNum}}/100</span>

/** 广告组名称字符限制 **/
    campaignNameInput() {
      let temp = 0;
      for (var i = 0; i < this.form.campaignName.length; i++) {
        if (/[\u4e00-\u9fa5]/.test(this.form.campaignName[i])) {
          temp += 2
        } else {
          temp++
        }
      }
      this.campaignNameNum = temp;
    },

.gray{
    color: gray;
  }

这个我字数限制的提示 我写在了外面了，如果大家有更好的办法，可以提供一下