微信小程序 密码框改为text后不可见，需要点击一下

这个问题是做项目的时候碰到的。
密码框常规写法：

2. <view class="inputBox">
3.   <view class="input-container">
4.     <input type="{{inputType}}" placeholder="请输入密码" data-id="passwordValue" bindinput="getinput" value="{{passwordValue}}" placeholder-style="color:#ccc8c8" />
5.     <image class="eye-icon" src="{{isPasswordVisible ? '/images/open-eye.png' : '/images/closed-eye.png'}}" bind:touchstart="onEyeTouchStart" bind:touchend="onEyeTouchEnd"/>
6.   </view>
7. </view>

复制代码

函数：onEyeTouchStart 和 onEyeTouchEnd 的实现：

2. onEyeTouchStart() {
3.     const passwordValue = this.data.passwordValue;
4.     this.setData({
5.       inputType: 'text',
6.       isPasswordVisible: true
7.     });
8.   },
9.   onEyeTouchEnd() {
10.     const passwordValue = this.data.passwordValue;
11.     this.setData({
12.       inputType: 'password',
13.       isPasswordVisible: false,
14.     });
15.   },

复制代码

然后就会出现以上的问题(真机上)，后来查了不少资料，有个方法可以办理这个问题：
那就是改变input属性后刷新一下，我改进了一下，确实办理了这个问题，特此记录。
改进后的代码：

2. onEyeTouchStart() {
3.     const passwordValue = this.data.passwordValue;
4.     this.setData({
5.       inputType: 'text',
6.       isPasswordVisible: true,
7.       passwordValue:''
8.     },()=>{
9.       this.setData({
10.         passwordValue:passwordValue
11.       });
12.     });
13.     console.log('in onEyeTouchStart,inputType:',this.data.inputType,'isPasswordVisible',this.data.isPasswordVisible);
14.   },
15.   onEyeTouchEnd() {
16.     const passwordValue = this.data.passwordValue;
17.     this.setData({
18.       inputType: 'password',
19.       isPasswordVisible: false,
20.       passwordValue:''
21.     },()=>{
22.       this.setData({
23.         passwordValue:passwordValue
24.       });
25.     });
26.     console.log('in onEyeTouchEnd,inputType:',this.data.inputType,'isPasswordVisible',this.data.isPasswordVisible);
27.   },

复制代码