|
16 | 16 | </view> |
17 | 17 | <view class="uni-form-item uni-column"> |
18 | 18 | <view class="title">实时获取输入值：{{inputValue}}</view> |
19 | | - <input class="uni-input" @input="bindKeyInput" placeholder="输入同步到view中" /> |
| 19 | + <input class="uni-input" @input="onKeyInput" placeholder="输入同步到view中" /> |
20 | 20 | </view> |
21 | 21 | <view class="uni-form-item uni-column"> |
22 | 22 | <view class="title">控制输入的input</view> |
23 | | - <input class="uni-input" @input="bindReplaceInput" v-model="changeValue" placeholder="连续的两个1会变成2" /> |
| 23 | + <input class="uni-input" @input="replaceInput" v-model="changeValue" placeholder="连续的两个1会变成2" /> |
24 | 24 | </view> |
| 25 | + <!-- #ifndef MP-BAIDU --> |
25 | 26 | <view class="uni-form-item uni-column"> |
26 | 27 | <view class="title">控制键盘的input</view> |
27 | | - <input class="uni-input" ref="input1" @input="bindHideKeyboard" placeholder="输入123自动收起键盘" /> |
| 28 | + <input class="uni-input" ref="input1" @input="hideKeyboard" placeholder="输入123自动收起键盘" /> |
28 | 29 | </view> |
| 30 | + <!-- #endif --> |
29 | 31 | <view class="uni-form-item uni-column"> |
30 | 32 | <view class="title">数字输入的input</view> |
31 | 33 | <input class="uni-input" type="number" placeholder="这是一个数字输入框" /> |
|
49 | 51 | <view class="uni-form-item uni-column"> |
50 | 52 | <view class="title">带清除按钮的输入框</view> |
51 | 53 | <view class="with-fun"> |
52 | | - <input class="uni-input" placeholder="带清除按钮的输入框" :value="inputClearValue" @input="bindClearInput" /> |
| 54 | + <input class="uni-input" placeholder="带清除按钮的输入框" :value="inputClearValue" @input="clearInput" /> |
53 | 55 | <view class="uni-icon uni-icon-clear" v-if="showClearIcon" @click="clearIcon"></view> |
54 | 56 | </view> |
55 | 57 | </view> |
|
71 | 73 | focus: false, |
72 | 74 | inputValue: '', |
73 | 75 | showClearIcon: false, |
74 | | - inputClearValue: "", |
75 | | - changeValue:"", |
| 76 | + inputClearValue: '', |
| 77 | + changeValue: '', |
76 | 78 | showPassword: true, |
77 | | - src: "../../../static/eye-1.png" |
| 79 | + src: '../../../static/eye-1.png' |
78 | 80 | } |
79 | 81 | }, |
80 | 82 | methods: { |
81 | | - bindKeyInput: function (e) { |
82 | | - this.inputValue = e.target.value |
| 83 | + onKeyInput: function(event) { |
| 84 | + this.inputValue = event.target.value |
83 | 85 | }, |
84 | | - bindReplaceInput: function (e) { |
85 | | - var value = e.target.value; |
86 | | - if(value === '11'){ |
87 | | - this.changeValue = "2"; |
| 86 | + replaceInput: function(event) { |
| 87 | + var value = event.target.value; |
| 88 | + if (value === '11') { |
| 89 | + this.changeValue = '2'; |
88 | 90 | } |
89 | 91 | }, |
90 | | - bindHideKeyboard: function (e) { |
91 | | - if (e.target.value === '123') { |
92 | | - // 收起键盘 |
| 92 | + hideKeyboard: function(event) { |
| 93 | + if (event.target.value === '123') { |
93 | 94 | uni.hideKeyboard(); |
94 | 95 | } |
95 | 96 | }, |
96 | | - bindClearInput: function (e) { |
97 | | - this.inputClearValue = e.target.value; |
98 | | - if (e.target.value.length > 0) { |
| 97 | + clearInput: function(event) { |
| 98 | + this.inputClearValue = event.target.value; |
| 99 | + if (event.target.value.length > 0) { |
99 | 100 | this.showClearIcon = true; |
100 | 101 | } else { |
101 | 102 | this.showClearIcon = false; |
102 | 103 | } |
103 | 104 | }, |
104 | | - clearIcon: function () { |
105 | | - this.inputClearValue = ""; |
| 105 | + clearIcon: function() { |
| 106 | + this.inputClearValue = ''; |
106 | 107 | this.showClearIcon = false; |
107 | 108 | }, |
108 | | - changePassword: function () { |
| 109 | + changePassword: function() { |
109 | 110 | this.showPassword = !this.showPassword; |
110 | 111 | } |
111 | 112 | } |
112 | 113 | } |
113 | 114 | </script> |
114 | 115 |
|
115 | 116 | <style> |
116 | | - .title{padding:10upx 25upx;} |
117 | | -</style> |
| 117 | + .title { |
| 118 | + padding: 10upx 25upx; |
| 119 | + } |
| 120 | +</style> |
0 commit comments