uniapp input组件实现聚焦
·
目前有一个功能需求是在uniapp中 有一个input输入框默认为disabled,通过点击旁边的编辑icon移除disabled并且聚焦。
实现方法:
input:
<input type="text" :class="['inputAmount', { 'actualDisabled': actualDisabled }]" v-model="inputAmount" @blur="actualAmountBlur" :focus="isFocus" :disabled="actualDisabled">
data中声明的响应式数据:
data() {
return {
inputAmount: 0,
actualDisabled: true,
isFocus: false,
}
},
图片:
<image src="../../../static/as_edit_amount.png" class="editAmount"@click="actualAmountFocus"/>
方法:
actualAmountFocus() {
this.actualDisabled = false;
this.isFocus = false;
this.$nextTick(() => {
setTimeout(() => {
this.isFocus = true;
}, 100);
});
},
更多推荐


所有评论(0)