1.什么是自定义指令:

看完这段话,依然是云里雾里。。。来看代码:

看看成果:

同时应用全局自定义指令:

成果:

依然好使,并且不报错,那么优先级又是怎么的呢?

成果:

显然,同名的部分自定义指令会笼罩同名的全局自定义指令。

2.自定义指令的钩子:能够比照Vue的生命周期进行了解

(1)bind:此时的DOM元素并没有挂载到页面上

察看后果,发现focus()办法并不会失效:

(2)inserted:其实此时曾经插入文档中了,例子在下面

(3)update:能够了解为仅当绑定的值产生扭转时才执行

成果:

(4)componentUpdated:顾名思义吧,在update之后执行

(5)unbind:dom元素被删除之后执行

成果:

3.上述钩子函数的参数:看文字不清晰,上面用代码加输入后果进行展现

(1)el:

后果:

(2)binding、vnode、oldVnode:

后果:

4.练习-----实现v-show:

暗藏成果如下:

显示成果如下:

5.函数式简写:

代码:

成果:

6.总结:就像v-show的小练习一样,咱们同样能够应用自定义指令去模仿v-bind、v-model等很多很多指令,除了模仿之外,咱们还能够编写一些本人的指令。写代码贵在想法,而想法也会随着教训的晋升而变得越来越多。这就是编写代码的乐趣所在。持续为了写出丑陋的代码而致力!