vue基础知识点

1.什么是Vue?

Vue是一套构建用户界面的渐进式的JavaScript框架。

特点:

A.采用组件化模式,提高代码复用率,且让代码更好维护。

B.声明式编码,采用虚拟DOM,无需直接操作真实DOM,提高开发效率。

2.Vue模板语法

A.插值语法:

功能:用于解析标签体内容。

写法:{{xxx}},xxx是js表达式,且可以直接读取到data中的所有属性。

B.指令语法:

功能:用于解析标签。

单项绑定 v-bind:href="xxx"或简写成:href="xxx"

渲染文本 v-text(不解析标签)

渲染文本 v-html(解析标签)

多项绑定 v-model="name" 只能用在表单元素上,默认搜集的就是value值。

失去焦点时再收集数据 .lazy

输入字符串转为有效数字 .number

输入首尾空格过滤 .trim

事件绑定 v-on:click="xxx" 或简写成@click="xxx"

阻止默认事件 .prevent

阻止事件冒泡 .stop

事件只触发一次 .once

事件捕获 .capture

3.MVVM的理解

M是模型:data中的数据

V是视图:模板代码

VM是视图模型:Vue实例

4.计算属性computed和监视属性watch的区别

A.computed能完成的功能,watch都可以完成.

B.watch能完成的功能,computed不一定能完成.例如:watch可以进行异步操作.

重要原则：

A.所被vue管理的函数,最好写成普通函数,这样this的指向才是vm或组件实例对象。

B.所有不被vue所管理的函数(定时器的回调函数、ajax的回调函数、Promise的回调函数),最好写成箭头函数,这样this的指向才是vm或组件实例对象.

5.条件渲染v-show与v-if

A.v-show="表达式"

特点:适用于切换频繁较高的场景,不展示DOM元素未被移除,仅仅是使用样式隐藏掉。

B.v-if="表达式" v-else-if="表达式" v-else

特点:适用于切换频率较低的场景,不展示DOM元素直接被移除。

6.列表渲染v-for

v-for="(item,index) in list" :key="index"

7.Vue的生命周期

将要创建 beforeCreate

创建完毕 created

将要挂载 beforeMount

挂载完毕 mounted

将要更新 beforeUpdate

更新完毕 updated

将要销毁 beforeDestroy

销毁完毕 destroyed