Vue全局API

一、 全局API:不在构造器里,而是先声明全局变量或直接在Vue上定义一些新功能。在构造器外部用Vue提供的API函数来定义新的功能。

二、 自定义指令:Vue.directive

Vue.directive('changecolor',function(el,binding,vnode){
        el.style='color:'+binding.value;
});
div v-changecolor="color" id="demo">
            {{num}}
        </div>
1. 三个参数:

1)el:制定所绑定的元素,可以用来直接操作DOM

2)binding:一个对象,包含指令的很多信息

3)vnode:vue编译生成的虚拟节点

2. 自定义指令生命周期:

1)bind:只调用一次,指令第一次绑定到元素时调用,用这个钩子函数可以定义一个绑定时执行一次的初始化动作。

2)inserted:被绑定元素插入父节点时调用(父节点存在即可调用,不必存在于document中)。

3)update:被绑定于元素所在的模板更新时调用,而无论绑定值是否变化。通过比较更新前后的绑定值,可以忽略不必要的模板更新。

4)componentUpdated:被绑定元素所在模板完成一次更新周期时调用。

5)unbind:只调用一次,指令与元素解绑时调用。


三、vue.extend

返回一个扩展实力构造器,预设部分选项的vue实例构造器。服务于vue.component用来生成组件。当在模板中遇到该组件名称作为标签的自定义元素时,会自动调用“扩展实例构造器”来生产组件实例,并挂载到自定义元素上。

1)构造器

var authorExtend = Vue.extend({
    template:"<p><a :href='authorUrl'>{{authorName}}</a></p>",
    data:function(){
    return{
          authorName:'apple',
          authorUrl:'http://www.apple.com'
          }
    }
});
2)挂载

new authorExtend().$mount('author');
3)写入挂载元素,元素可以是标签、组件等
<author></author>


四、vue.set全局操作:
1)作用:在构造器外部操作构造器内部的数据、属性或方法。
2)优势:vue有时不能自动检测一下变动的数组。

  • 利用索引直接设置项目
  • 修改数组长度
 function add() {
            Vue.set(app.arr, 1, 'ddd');
        }




评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值