前言

大家都知道在Vue中，我们平时数据驱动视图时候，内部自带的指令有时候解决不了一些需求，这时候，Vue给我们一个很好用的东东来实现自定义指令，这就是directive。下面话不多说了，来一起看看详细的介绍：

directive

这个单词是我们写自定义指令的关键字哦

自定义指令为我们提供了几个钩子函数，这时候你一定好奇什么是钩子函数，说简单点，就是集中表现状态

• bind

  : 只调用一次，指令第一次绑定到元素时调用，用这个钩子函数可以定义一个在绑定时执行一次的初始化动作。

• inserted

  : 被绑定元素插入父节点时调用（父节点存在即可调用，不必存在于 document 中）。

• update

  : 被绑定元素所在的模板更新时调用，而不论绑定值是否变化。通过比较更新前后的绑定值，可以忽略不必要的模板更新（详细的钩子函数参数见下）。

• componentUpdated

  : 被绑定元素所在模板完成一次更新周期时调用。

• unbind

  : 只调用一次， 指令与元素解绑时调用。

下面我们开始上代码，让我们更好的理解自定义指令怎么做