学习课程:前端工程师2022版-vue基础入门
lesson28:Mixin混入的基础语法(2)1-2 Mixin 混入的基础语法(2)-慕课网体系课 (imooc.com)
lesson29:开发实现Vue中的自定义指令
1-3 开发实现 Vue 中的自定义指令(1)-慕课网体系课 (imooc.com)
1-4 开发实现 Vue 中的自定义指令(2)-慕课网体系课 (imooc.com)
讲师:Dell老师
今天继续昨天的课程安排,学习了Mixin混入的基础语法(2)和开发实现Vue中的自定义指令。
当一个属性直接被定义在实例中而不是data函数中时,这种属性被称为自定义属性。
当实例中定义了一个自定义属性,外面局部Mixin也定义了一个同名属性并且混入,调用时会优先调用组件中的自定义属性。
当然我们也可以人为定义自定属性的优先级,通过定义app.config.optionMergeStrategies.(自定义属性)为一个函数。函数接收两个参数,分别为mixinVal和appValue。通过返回一个表达式mixinVal || appValue,当有混入插入到实例里面则优先返回mixinVal,没有就返回appValue。
Vue 除了提供了默认内置的指令外,还允许开发人员根据实际情况自定义指令,它的作用价值在于当开发人员在某些场景下需要对普通 DOM 元素进行底层操作的时候。
Vue 自定义指令和组件一样存在着全局注册和局部注册两种方式。全局注册的自定义指令可以在项目中的所有组件中使用,局部注册的指令只能在当前组件内部使用。
我们可以通过调用 Vue.directive 的方式来定义全局指令, 它接收两个参数:1. 指令名,2. 指令的钩子函数对象。
指令的局部注册和组件的局部注册类似,在实例的参数 options 中使用 directives 选项来注册局部指令,局部指令只能在当前这个实例中使用。继续加油!