Vue

初始化脚手架 脚手架简介（CLI） 1、脚手架官方名称：CLI（command line interface） 2、Vue脚手架是Vue官方提供的标准化开发工具（开发平台） 3、官方文档 CLI的安装

基本概念 传统方式编写应用与组件化方式编写应用的对比 对比：组件化编写应用更加高效方便，比如我们不同的网站用同一个顶部组件，我们只需要引入组件即可；而传统的编写方式需要重新编写或复制html、css、

引出生命周期 1、生命周期：生命周期又名回调函数、生命周期函数、生命周期钩子； 2、是什么？Vue在关进时刻帮我们调用的一些特殊名称的函数； 3、生命周期函数的名字不可更改，但函数的具体内容是程序员根

局部自定义指令 自定义指令--函数式写法 1、需求一：定义一个v-big指令，和v-text功能类似，但会把绑定的数值放大10倍 2、实现：下面用函数式写法写一个自定义指令，函数式写法比较简单，但无法

内置指令复习 v-text指令 1、作用：向其所在的节点中渲染文本内容 2、与插值语法的区别：v-text会替换掉节点中的内容，{{xx}}则不会； 3、案例： 效果： v-html指令 1、作用：向

过滤器 1、定义：对要显示的数据进行特定格式化后再显示（适用于一些简单逻辑的处理）。 2、语法： （1）注册过滤器：全局过滤器：Vue.filter(name,callback) ， 局部过滤器：ne

收集表单数据 1、若：<input type = "text" />，则v-model收集的是value的值，用户输入的就是value值； 2、若：<input type = "radio" /> ，

Vue监视数据的原理： 1、vue会监视data中所有层次的数据 2、如何监测对象中的数据？ 通过setter实现监视，并且要在new Vue()时就传入要监测的数据。 （1）对象中后追加的属性，Vu

基本列表（v-for） 1、v-for指令 （1）用于展示列表数据 （2）语法v-for="(item, index) in xxx" :key="yyy" （3）可遍历：数组、对象、字符串（用的很少

条件渲染 1、v-if （1）用法 （2）适用于：切换频率较低的场景 （3）特点：不展示的DOM元素直接被移除 （4）注意v-if可以和:v-else-if、v-else一起使用，但要求结构不能被“打

计算属性（computed） 定义：要用的属性不在data中，需要通过已有属性的计算得到； 原理：底层借助了Object.defineproperty方法提供的getter和setter get函数什

事件处理的基本用法 使用v-on:xxx或@xx绑定事件（xxx是事件名称）； 事件的回调需要配置在methods对象中，最终会在vm上； methods中配置的函数，不要用箭头函数，因为箭头函数中t

MVVM模型 1、模型组成： （1）M：Model模型，用于保存数据 （2）V：View视图，对应template中的DOM部分 （3）VM：ViewModel视图模型，是连接视图和模型之间的地方，比

模板语法 插值语法 1、作用：将js中表达式放入页面 2、语法： 指令语法 1、作用：可以解析标签内容，当表达式的值改变时，将其产生的连带影响，响应式地作用于DOM。