摘要：自定义指令的使用在组件中定义一个自定义指令，作用将当前节点中字体颜色设置为红色。参考内容自定义指令
1.自定义指令的使用
在组件中定义一个自定义指令，作用：将当前DOM节点中字体颜色设置为红色。
在自定义指令中简化了钩子函数，下面的钩子函数相当于 bind 和 unbind 的缩写：
在页面结构中，通过 v-set-red 来使用上面自定义的指令：
2.认识自定义指令的钩子函数这是一个div标签
自定义指令也是存在生命周期的，也存在生命周期钩子。
在实际使用的时候，一般只关注三个钩子函数：
绑定时调用的钩子 bind
被绑定元素插入父节点时调用的钩子 inserted
解绑时调用的钩子 unbind
在实际调用的时候，bind和inserted都会调用，而unbind只有在页面热刷新(即在vue-cli中增加或删除节点)的时候才会调用。
3.钩子函数参数el钩子函数的参数可以参照官网的内容：自定义指令
el 当前的DOM节点
el.style 当前节点的样式，如el.style.width
el.dataset 当前节点的自定义属性，如data-test="123"
输出的结果：
"text" "内容" "wang" "100%"
可以看出 el el.value el.dataset.test el.style.width 分别输出的内容是什么。
4.参考内容自定义指令
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/92005.html
摘要：首先把改成的形式这是一段测试文字绑定最后的显示效果如下，如果要看具体的形式，可以在谷歌人员开发工具中自行查看指令的组成部分经过上面的介绍，应该对指令有一个大概的认识，下面就来对指令的每一项进行说明。 这篇笔记主要用来说明 Vue 中数据的定义和指令的一些特性，后续会做更深入的说明。 1.Vue中的data函数 1-1 使用data函数 由于使用的是单文件组件，因此 Vue 组件中的数据...
摘要：插件的定义与使用插件的定义需要注意的点定义一个对外公开的方法方法有两个参数第一个参数的构造器，第二个参数是一个可选的对象必须，插件对外公开的方法构造器可选参数，是一个对象添加全局方法或属性添加全局方法或属性添加全局资源指令过滤器过渡等添 1.插件的定义与使用 1-1 插件的定义 需要注意的点： 定义一个对外公开的install方法 install方法有两个参数：第一个参数Vue的构造...
摘要：绑定绑定，使用，简写的形式是。绑定比较灵活，可以使用表达式字符串对象或数组。绑定字符串绑定字符串的时候只能绑定一个，不能绑定多个。 1.绑定Class 绑定Class，使用 v-bind:class，简写的形式是 :class。绑定Class比较灵活，可以使用表达式、字符串、对象或数组。 1-1 搭建结构 首先，新建一些 class 样式： .colorRed { colo...
摘要：如果要修改上面代码中的过滤器，根据传入的参数来分割字母，可以使用下面的方式修改。参数传递情况作为的参数的结果作为的参数的结果作为的参数参考内容过滤器 1.认识过滤器 过滤器的作用：用于文本格式化，仅仅作为格式化操作，不做复杂的业务处理 过滤器的使用方式：通过管道符号(|)来使用 过滤器的使用位置：mustache插值和v-bind表达式 2.过滤器的简单使用 2-1 使用过滤器 ...
摘要：混合中的钩子函数同名钩子函数都会执行如果组件中存在钩子函数，混合中也存在相同的钩子函数，那么两个钩子函数都会执行。最终的执行结果多个混合的钩子函数多个混合的钩子函数，会根据混合使用的顺序来执行。 1.认识混合 混合(mixins)是一种分发Vue组件中可复用功能的非常灵活的方式 混合的作用：抽取多个组件的共同部分，增强组件的可复用性 混合的实质：混合对象类似一个Vue实例，可以包含V...
阅读 2017·2021-08-21 14:09
阅读 483·2019-08-30 15:44
阅读 2109·2019-08-29 16:32
阅读 1372·2019-08-29 15:36
阅读 3437·2019-08-29 12:43
阅读 2778·2019-08-29 11:14
阅读 432·2019-08-28 18:26
阅读 2247·2019-08-26 13:57
