一、效果展示
因为uview的框架原本的type=’password‘和password-icon不生效,实在没有办法只能换成下面这样写(需要导入iconfont图标)
二、代码
html部分
<u-form-item style="position: relative;">
<input class="uni-input" :password="showPassword" name="password" clearable border="bottom"
v-model="loginForm.password" type="number" placeholder="密码" />
<view :class="[showPassword==true?'iconfont icon-jurassic_loseeyes':' iconfont icon-jurassic_openeyes']"
style="font-size: 40rpx; position: absolute; right: 10%;" @click="showPassWord">
</view>
</u-form-item>
js部分
data() {
return {
passwordIcon: true,
showPassword: true,
loginForm:{
password :'',
}
}
},
methods: {
showPassWord(){
this.showPassword =! this.showPassword
},
},