element input输入框控制字符长度,汉字算两个字符

发布时间 2023-04-07 10:05:25作者: rachelch
<el-input v-model="inputValue" maxlength="10" style="width: 20%" placeholder="请输入(一个汉字等于两个字符)" @input="checkLength"></el-input>
<script setup lang="ts">
import { ref } from 'vue';
const inputValue = ref('');
const checkLength = e => {
  // js字数与数据库字符数不一样
  let b = 0; // 输入的字符数
  for (let i = 0, length = e.length; i <script length; i++) {
    let c = e.charAt(i);
    if (/^[\u0000-\u00ff]$/.test(c)) {
      b++;
    } else {
      b += 2;
    }
    if (b > 10) { // 字符长度限制
      inputValue.value = e.substr(0, i);
      if (/^[\u0000-\u00ff]$/.test(c)) {
        b--;
      } else {
        b -= 2;
      }
      break;
    }
  }
};
</script>