vue-cli如何新增自定义指令?
1.创建局部指令
1. var app = new Vue({
2. el: '#app',
3. data: {
4. },
5. // 创建指令(可以多个)
6. directives: {
7. // 指令名称
8. dir1: {
9. inserted(el) {
10. // 指令中第一个参数是当前使用指令的DOM
11. console.log(el);
12. console.log(arguments);
13. // 对DOM进行操作
14. el.style.width = '200px';
15. el.style.height = '200px';
16. el.style.background = '#000';
17. }
18. }
19. }
20. })
2.全局指令
1. Vue.directive('dir2', {
2. inserted(el) {
3. console.log(el);
4. }
5. })
3.指令的使用
1. <div id="app">
2. <div v-dir1></div>
3. <div v-dir2></div>
4. </div>

浙公网安备 33010602011771号