访客 由于网站整体用的是elementui样式，但是在使用过程发现，type为password类型的输入框，若使用show-password参数虽然可以做到点击一下隐藏再点击一下显示的效果，但是页面的交互显示的一直都是这个样子的：小图标，显然我们想要的是可以“睁眼”和“闭眼”的小图标，SO就需要我们DIY一下子（指时间短暂或动作迅速）（指时间短暂或动作迅速）了。
准备图标
首先我们需要找到两个心仪的小图标：
``
创建div
<el-inputid="passwordinput":type="pwdType"autocomplete="off"v-model="password"placeholder="请输入密码"></el-input><img:src="seen?openeye:offeye"@click="changeye()"class="eye">设置样式
.eye{width:18px;height:20px;position:absolute;left:93%;top:42%;}定义数据
data(){return{`seen:'',pwdType:'password',openeye:require('../../static/assets/images/icons/openeye.jpg'),offeye:require('../../static/assets/images/icons/offeye.jpg'),password:null}}``定义函数
changeye(){this.pwdType=this.pwdType==='password'?'text':'password'this.seen=!this.seen}兼容问题
你以为到这里就到这里就大功告成了嘛，nonono当你使用MicrosoftEdge查看的时候会发现，这个浏览器竟然自己带隐藏和显示的小图标，我们需要把自带的图标隐藏掉以解决兼容性的问题
//注：要放到<style>中，而不是<stylescoped>中！#passwordinput::-ms-reveal{display:none;}#passwordinput::-ms-clear{display:none;}#passwordinput::-o-clear{display:none;}以上大功告成！