Vue3: 自定义指令
vue
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
项目地址:https://gitcode.com/gh_mirrors/vu/vue
免费下载资源
·
1、什么是自定义指令
- vue 官方提供了 v-for、v-model、v-if 等常用的内置指令。除此之外vue 还允许开发者自定义指令。
- vue 中的自定义指令分为两类,分别是:
⚫ 私有自定义指令
⚫ 全局自定义指令
2、声明私有自定义指令的语法
- 在每个 vue 组件中,可以在 directives 节点下声明私有自定义指令。示例代码如下:
3、使用自定义指令
- 在使用自定义指令时,需要加上 v- 前缀。示例代码如下:
4、声明全局自定义指令的语法
- 全局共享的自定义指令需要通过“单页面应用程序的实例对象”在main.js文件中进行声明,示例代码如下:
5、updated 函数
- mounted 函数只在元素第一次插入 DOM 时被调用,当 DOM 更新时 mounted 函数不会被触发。 updated函数会在每次 DOM 更新完成后被调用。示例代码如下:
注意:在 vue2 的项目中使用自定义指令时,【mounted -> bind 】【 updated -> update 】
6、函数简写
- 如果 mounted 和updated 函数中的逻辑完全相同,则可以简写成如下格式:
7、 指令的参数值
- 在绑定指令时,可以通过“等号”的形式为指令绑定具体的参数值,示例代码如下:
GitHub 加速计划 / vu / vue
83
16
下载
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:4 个月前 )
9e887079
[skip ci] 3 个月前
73486cb5
* chore: fix link broken
Signed-off-by: snoppy <michaleli@foxmail.com>
* Update packages/template-compiler/README.md [skip ci]
---------
Signed-off-by: snoppy <michaleli@foxmail.com>
Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 6 个月前
更多推荐
已为社区贡献5条内容
所有评论(0)