你会遇到的vue小知识！

实例： @click.stop=“clickme”;
1, .stop //阻止冒泡
2，.prevent //阻止默认事件
3，.once //只触发一次
4，.native //监听组件根元素的原生事件
5，.left //点击鼠标左键触发
6，.right //点击鼠标右键触发
7，.middle //点击鼠标中键触发
8，v-model.lazy //懒加载
9，v-model.number=“msg” //只能输入数字
10，v-model.trim=“msg” //去除空格

绑定标签上的属性
v-pre; 对此标签原样输出
v-cloak； 渲染完成后才显示
v-once; 只渲染一次

a) Vue.directive(); //自定义指令
生命周期：
bind : fun( el,binding ){} //被绑定时调用（用于执行初始化，只调用1次）
inserted : fun( el,binding ){} //绑定到节点时调用
update : fun( el,binding ){} //组件更新时调用
compontUpdated : fun( el,binding ){} //组件更新完成调用
unbind : fun( el,binding ){} //（解绑时调用）只调用一次
app.$destroy();//销毁aaa.$mount(’#author’); //将aaa绑定到id为author的元素上
b) Vue.set()
c) Vue的生命周期（钩子函数）
beforeCreate //初始化之后
created //创建完成
beforeMount //挂载之前
mounted //挂载之后
beforeUpdate //数据更新前
updated //数据被更新后
activated //组件激活时调用
deactivated //组件停止时调用
beforeDestroy //销毁之前
destroyed //销毁之后
d) template:"#id" //制作模板（挂载模板）
标签模板模板内容
script模板（type=‘x-template’）
e) component 组件(针对组件专门讲解)
v-bind:is = “…”； 动态绑定组件（后面接data中定义的名字：对应的是创建出来的组件）
Vue.component(name,{template:…}); //定义全局组件(在构造器外定义)

局部组件（在构造器里面定义）
components ： {“name”:{template : …}，…}; //可定义多个
template : //模板
props ：[] //挂载属性

reverse() ; 数组反转

a) propsData{} //创建实例时传递props.主要作用是方便测试
定义组件中的插值
b) computed{} //计算
c) methods{} //方法
d) watch{} //监听data中数据的变化
watch{ msg : function(newVal,oldVal){ } } //在构造器里面使用
app.$watch(‘msg’,function(newVal,oldVal){ }) //在构造器外面使用
e) mixins : [] //混入，不想改动构造器的情况下，在构造器外部重新定义个一个对象，用混入的方式插入执行
f) extends:对象变量 //扩展（与mixins类似）
i. 注意：如果与构造器中的方法名一致，则扩展出来的方法不执行

a) 概述：实例就是在构造器外部操作构造器内部的属性选项或者方法，就叫做实例？实例的作用就是给原生的或者其他javascript框架一个融合的接口或者说是机会，让Vue和其他框架一起使用。
b) 实例方法
var a =Vue.extend({ template : … }) //扩展实例构造器(和组件配合使用，用于复用某一模块代码)
vm = new a().$mount{(}^{\prime }heade{r}^{\prime });//挂载vm.$destroy() ; //卸载(销毁)方法
vm.$forceUpdate();//更新(刷新)方法vm.$nextTick(func(){ 数据更新之后的回调 }) ; //数据修改方法（和构造器里的update生命周期很像）
//使用
c) 实例事件
概述：实例事件就是在构造器外部写一个调用构造器内部的方法。这样写的好处是可以通过这种写法在构造器外部调用构造器内部的数据。
var app = new Vue({ … });
app.KaTeX parse error: Expected '}', got 'EOF' at end of input: …nc 方法名称(){ app.emit(‘方法名称’) }; //这样$on定义的方法在外部就可以用了app.$once(“方法名称”，func(){ … }); //只调用一次
func off(){ app.KaTeX parse error: Expected 'EOF', got '}' at position 13: off('方法名称') }̲; //off关闭事件（外部调用）
d) 内置组件-slot讲解
概述：slot是标签的内容扩展，也就是说你用slot就可以在自定义组件时传递给组件内容，组件接收内容并输出。
使用slot需要2步

1. 在HTML的组件中用slot属性传递值。

{{jspangData.bolgUrl}}
{{jspangData.netName}}
{{jspangData.skill}}

2. 在组件模板中用标签接收值。

3. Script代码

最后

以上就是重要橘子为你收集整理的你会遇到的vue小知识！的全部内容，希望文章能够帮你解决你会遇到的vue小知识！所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。