当你的产品告诉你,给你个按钮,点击它给我弹出键盘,然后让输入框给我获取焦点。这时就需要今天我们分享的"小栗子"了,废话不多说,开整。
涉及内容Vue.js与自定义指令(directives)
html部分
<input type="text" @blur="focusState = false" v-focus="focusState">
<div @click="focusclick">按钮</div>
js部分
new Vue({
el: '#app',
data: {
message: 'hello!',
focusState: false
},
methods: {
focusclick () {
this.focusState = true
}
},
directives: {
focus: {
//根据focusState的状态改变是否聚焦focus
update: function (el, {value}) { //第二个参数传进来的是个json
if (value) {
el.focus()
}
}
}
}
})