自定义指令
注意,Vue中所有的指令都以"v-"开头
使用Vue.directive()定义全局的指令
其中,参数1:指令的名称(定义时不需要加上“v-”,但是调用时必须要加上“v-”)
参数2,是一个对象,这个对象身上,有一些指令相关的函数,这些函数可以在特定的阶段,执行特定的操作
方法体中有一些特定的方法
无论在哪个方法上,第一个参数都是el,表示被绑定了指令的那个元素,这个el参数,是一个原生的js对象
- bind:function(){}每当指令绑定到元素上的时候,就会立即执行这个bind函数,只执行一次
- inserted:function(){}表示元素插入到DOM中时候,回字形inserted函数,只有这个可以一开始就插入到DOM中去,也就是说只有这个可以在一开始就执行
- updated:function(){}当VNode更新的时候,就会执行updated,可能会触发多次
<div id="app">
<input type="text" v-focus>
</div>
<script>
Vue.directive('focus',{
inserted:function(el){
el.focus()
},
})
var vm=new Vue({
el:'#app',
})
</script>
实现文本框的一开始就获取焦点