【Vue】实现显示输入框字符长度

 <div style="float: right; margin-right: 10px">
      <el-popover placement="top-start" width="200" trigger="hover" :content="'当前输入的内容字节长度为：' +
        this.byteLength +
        '，剩余可输入的字节长度和最大文本长度设置的最大值为：' +
        (4096 - this.byteLength)
        ">
        <el-button slot="reference" type="text" class="el-icon-info"></el-button>
      </el-popover>
      <span style="line-height: 50px; font-size: 10px"> 字节长度： </span>
 
      <span style="line-height: 50px; font-size: 12px; color: #aaa">{{
        this.byteLength
      }}</span>
    </div>

computed: {
    byteLength() {
      var str = this.requestParams.prompt;
      if (str == null || str === undefined) return 0;
      if (typeof str != "string") {
        return 0;
      }
      var total = 0,
        charCode,
        i,
        len;
      for (i = 0, len = str.length; i < len; i++) {
        charCode = str.charCodeAt(i);
        if (charCode <= 0x007f) {
          total += 1; //字符代码在000000 – 00007F之间的，用一个字节编码
        } else if (charCode <= 0x07ff) {
          total += 2; //000080 – 0007FF之间的字符用两个字节
        } else if (charCode <= 0xffff) {
          total += 3; //000800 – 00D7FF 和 00E000 – 00FFFF之间的用三个字节，注: Unicode在范围 D800-DFFF 中不存在任何字符
        } else {
          total += 4; //010000 – 10FFFF之间的用4个字节
        }
      }
      return total;
    },
  },