登录页实现密码输入框可见切换功能时,在h5下正常,但在android下就不可以切换。
实现原来就是把input的type属性作为变量随data的更改,在h5下没有问题。
有没有人遇到过这种问题? 是weex的sdk本身就没实现还是bug?按照正常情况下属性发生变化应该是重新渲染了?
下面是我的代码
<template>
<div class="login">
<div class="div">
<text class="text">+86</text>
<input class="input" type="tel"></input>
</div>
<div class="div">
<text class="text">密码</text>
<input class="input" :type="inputType"></input>
<image class="icon" :src="imgShow" @click="onShowPasswd"></image>
</div>
</div>
</template>
<style>
.login {
width: 750;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
justify-content: column;
padding-left: 40;
padding-right: 40;
}
.div {
height: 82;
border-bottom-color: #dedede;
border-bottom-width: 1;
border-bottom-style: solid;
display: flex;
flex-direction: row;
align-items: center;
padding-left: 40;
margin-bottom: 2;
}
.text {
width: 110;
line-height: 80;
font-size: 32;
}
.input {
width: 430;
height: 80;
font-size: 32;
placeholder-color: #b8b8b8;
}
.icon {
width: 48;
height: 48;
align-self: center;
margin-left: 10;
}
</style>
<script>
module.exports = {
data:{
imgShow: '/resources/icon_invisible.png',
inputType: 'password'
},
created: function() {
this.inputType = 'password';
this.imgShow = '/resources/icon_invisible.png';
},
methods: {
onShowPasswd: function(e){
if(this.inputType == 'text'){
this.inputType = 'password';
this.imgShow = '/resources/icon_invisible.png';
}else{
this.inputType = 'text';
this.imgShow = '/resources/icon_visible.png';
}
}
}
}
</script>
哈哈,这个是个大锅,你修改SDK的下面这个代码就能实现,type切换成功,具体原因,比较两个方法,官方用的没有问题,但实际效果就是不行 尴尬