需求: 页面有个input元素,现在要鼠标光标聚焦在上面,让每个页面上的标签都可以聚焦光标,比如,从A页面跳转到B页面的时候,我们依然要聚焦。如果要一遍遍地操作dom就会很麻烦。
这个时候,为了方便开发,我们可以使用vue提供的自定义指令。
自定义指令有两种,分为全局注册和局部注册。
1、全局注册
1.1 在main.js 中 注册
javascript
// 1、注册指令
// 1.1 全局注册
Vue.directive('focussss',{
inserted(el){
el.focus()
}
})
1.2 使用
html
<input v-focussss type="text" ref="inp">
2、局部注册
2.1 在当前要使用指令的主键内,注册
javascript
export default {
components: {},
data() {
return {};
},
computed: {},
watch: {},
methods: {},
directives:{
focusdsg:{
inserted(el) {
el.focus()
}
}
}
}
2.2 使用
html
<input v-focusdsg type="text" ref="inp">