【踩坑笔记】vue3 element-plus el-input 无法输入问题

原因是 el-form 的 v-model="loginForm" ref="loginForm" 在vue3中值不能相同

把ref去掉或者改名即可

这是js的代码(对象记得用reactive,不然也会无法输入

import { reactive } from 'vue';

const loginForm = reactive({
  username: '',
  password: '',
});

const rules = reactive({
  username: [
    { required: true, message: '请输入用户名', trigger: 'blur' },
    { type: 'email', message: '请输入正确的邮箱', trigger: 'blur' },
  ],
  password: [
    { required: true, message: '请输入密码', trigger: 'blur' },
    { min: 6, max: 12, message: '长度在 6 到 12 个字符', trigger: 'blur' },
  ],
});

这个是可以输入的


    
      
    

这是无法输入的


    
      
    

就改了个ref

你可能感兴趣的:(vue.js,elementui,前端)