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