hexo+github搭建个人博客


[TOC]

自定义指令总结:

​ 一、定义语法

​ (1)局部指令:

​ new Vue({

​ directives:{

​ 指令名:配置对象 或

​ }

​ })

​ 或

​ new Vue({

​ directives:{

​ 指令名:回调函数

​ }

​ })

​ (2)全局指令:

​ Vue.directive(指令名,配置对象) 或 Vue.directive(指令名,回调函数)

​ 二、配置对象中常用的3个回调:

​ (1).bind:指令与元素绑定陈功时调用

​ (2).inserted:指令所在元素被插入页面时调用

​ (3).update:指令所在模板结构被重新解析时调用

​ 三、备注

​ 1.指令定义时不加v-,但使用时要加v-

​ 2.指令名如果是多个单词,则要使用kebab-case命名方式,

​ 不要使用camelCase命名(驼峰)

自定义指令的坑:

  1. 多个单词命名时,不推荐使用 ==驼峰命名法==

    why ?

    ​ 当你写成 v-bigNumber ,vue会将其转化为 v-bignumber

    当你在directive中使用时就要写

    ​ bignumber(){}

    Vue推荐的是what?

    ​ 使用 ‘-‘ 进行分隔 v-big-number

    在directive配置时,

    ​ ‘big-number’:function(){}

    tip : 在书写对象 时,原本的写法就是

    ​ ——–>”key”:value

    只是我们经常使用简写

    ​ ———————->big(){}

    但简写不支持-这种符号

    ​ so,需要写回本来的形式

    ​ —————–’big-number’:function(){}

  2. **==局部指令==**只能在同一个Vue实例中使用

    ​ how?配置全局

    ​ Vue.directive(‘name’,function/Object)