vue知识点归纳与总结，笔记

前言

当前总结是本人在业余学习与实践过程后的总结与归纳,旨在检验自己的积累,也方便忘记时查阅,同时也希望能帮助那些这方面知识匮乏的同行门,总结是基于vue2.x,vue-cli3.x,主要记录些，vue常用的指令、事件，监听、数据绑定、过滤器、组件、动画、vuex，vue-router等日常工作中时常用到的东西,也有些常用的插件和开发工具的介绍与使用，以及部分性能优化的建议与实践,如有不对，或不足的地方，也请各位大神，指出来，学习学习。

1.基础

1. 理解mvvm

m 是vue实例中的data,自定义的数据或后端返回的数组

不是后端mvc里的model概念不同。

vm 是vue的实例 m和v之间的调度者 是mvvm的核心思想

v是 html 要渲染的。

2. 常用指令

v-cloak 解决{{}}插值闪烁问题

v-text 会先执行 覆盖 元素中原本的内容 但是插值表达式只会覆盖自己的占位符，默认不会闪烁

v-html 渲染 html标签 覆盖元素中原有元素内容

v-bind: 简写为: 用来绑定数据 可以写合法的js表达式

v-on: 简写为 @ 用来点击事件

3.常用事件修饰符

stop 阻止冒泡 ：外层和里层都有方法 点击里层会产生冒泡，也会触发外层的事件。

顺序 从里到外产生事件

prevent 阻止浏览器默认行为 ：

a标签有浏览器默认行为。

capture 捕获事件 ：点击里层先触发外层再触发里层 顺序从外到里产生事件

self 只触发自己本身的事件 不会产生冒泡和捕获事件 类似于阻止冒泡 但只针对自己那一层 最外层还是会被最里层冒泡冒到 stop 是阻止所有层次

once 事件只执行一次

4.数据的绑定

v-bind: 数据的单向绑定

v-modle :数据的双向绑定 这个只能用于表单元素中

tips: 表单元素 radio text address email select checkbox textarea

5.class 绑定

1.数组带对象

<div :class="[classA,classB,{'classC':flag}]" >

data(){

return{

flag:true

}

}

tips:可以在类中的数组中写三元表达式,但推荐使用对象来代替它控制是否渲染

————————————————

版权声明：本文为CSDN博主「yaoxfly」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。

原文链接：https://blog.csdn.net/u010716530/article/details/103754983