element中 el-input 中的 autocomplete 属性怎么使用,为什么不生效

element中 el-input 中的 autocomplete属性怎么使用

想整体学一遍 element,学到 input 中看到了 autocomplete 这个属性,没有过多的介绍,我就自己试着写了写

<el-form :model="ruleForm" label-width="100px">
   <el-form-item label="账号">
     <el-input v-model="ruleForm.number" autocomplete="on" name="number"></el-input>
   </el-form-item>
   <el-form-item label="密码">
     <el-input v-model="ruleForm.pass" autocomplete="on" name="pass"></el-input>
   </el-form-item>
   <el-form-item>
     <el-button type="submit" @click="submitForm()">提交</el-button>
   </el-form-item>
 </el-form>
//data中定义的变量
 ruleForm: {
    
    
   	  pass: '',
      number: '',
  }
  
// 表单提交的方法
submitForm() {
    
    
 	alert('submit!');
 },

我把 autocomplete 属性打开了, 页面效果是这样的,当我输入账号:111,密码:222之后,点击提交,成功了之后刷新一下页面,重新点击,账号或者密码没有自动补全,于是我各种百度搜索这个东西怎么用
在这里插入图片描述

到最后终于解决了这个问题,原来在于提交的那个按钮我用的是button按钮,这样是错的,应该写成input

<el-form-item>
    <el-input type="submit" @click="submitForm()">提交</el-input>
</el-form-item>

这样就实现了自动补齐的功能,如下图
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/a1783118/article/details/128018432
今日推荐