用户名长度为6~20个英文字母或汉字组成的字符串正则校验vue.js

在.js中，你可以使用正则表达式校验用户名长度为6~20个英文字母或汉字组成的字符串。你可以在Vue组件的`methods`中定义一个校验函数，并使用`RegExp`对象进行正则表达式的匹配。

以下是一个示例：

<template>
  <div>
    <input v-model="username" @blur="validateUsername" placeholder="请输入用户名">
    <span v-if="usernameError" class="error">{{ usernameError }}</span>
  </div>
</template>

<script>
export default {
  data() {
    return {
      username: '',
      usernameError: ''
    };
  },
  methods: {
    validateUsername() {
      const regex = /^[\u4e00-\u9fa5a-zA-Z]{6,20}$/;
      if (!regex.test(this.username)) {
        this.usernameError = '用户名必须为6~20个英文字母或汉字组成';
      } else {
        this.usernameError = '';
      }
    }
  }
};
</script>

<style>
.error {
  color: red;
}
</style>

在上面的示例中，我们使用`v-model`指令绑定输入框的值到`username`属性上，当输入框失去焦点时，调用`validateUsername`方法进行校验。如果输入的用户名不符合正则表达式的要求，会显示错误信息。

请注意，上述示例只是一个简单的示范，你可以根据自己的需求进行修改和扩展。