vue密码包含字母或数字且20位字符内

以下是一个使用Vue.js实现的密码校验的例子：

<template>
  <div>
    <input type="password" v-model="password" @input="validatePassword" placeholder="请输入密码">
    <p v-if="passwordError" class="error">密码必须包含字母或数字且长度不能超过20位</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      password: '',
      passwordError: false
    }
  },
  methods: {
    validatePassword() {
      const regex = /^(?=.*[a-zA-Z0-9]).{1,20}$/; // 密码必须包含字母或数字，且长度不能超过20位
      this.passwordError = !regex.test(this.password);
    }
  }
}
</script>

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

在上面的例子中，我们使用了v-model指令来绑定输入框的值到password属性。当输入框的内容发生变化时，@input事件会触发validatePassword方法，该方法使用正则表达式来校验密码是否符合要求。

如果密码不符合要求，则将passwordError属性设置为true，从而显示错误提示信息。

你可以根据自己的需求修改正则表达式来实现其他的密码校验规则