内容一览
建议配合原图使用
vue简介
1.什么是vue
2. vue的特性
2.1数据驱动视图
2.2双向数据绑定
2.3 MVVM
2.4 MVVM的工作原理
vue的基本使用
1.基本使用步骤
2.基本代码与MVWM的对应关系
vue的调试工具
1.安装vue. devoos调试工具
2.配置Chrome浏览器中的vue devtools
3.使用vue- devtools调试vue页面
vue的指令与过滤器
1.指令的概念
指令(Directives) 是vue 为开发者提供的模板语法,用于辅助开发者渲染页面的基本结构。
1.1内容渲染指令
内容渲染指令用来辅助开发者渲染DOM元素的文本内容。常用的内容渲染指令有如下3个:
°v-text
{}}
v-html
1.2属性绑定指令
’如果需要 为元素的属性动态绑定属性值,则需要用到v bind属性绑定指令。
属性绑定指令的简写形式
使用Javascript表达式
1.3事件绑定指令
vue提供了v-on事件绑定指令,用来辅助程序员为DOM元素绑定事件监听。
事件绑定的简写形式
事件参数对象
绑定事件并传参
$event
事件修饰符
按键修饰符
1.4双向绑定指令
vue提供了v-model双向数据绑定指令,用来辅助开发者在不操作DOM的前提下,快速获取表单的数据。
v-model指令的修饰符
1.5条件渲染指令
条件渲染指令用来辅助开发者按需控制DOM的显示与隐藏。条件渲染指令有如下两个,分别是: .
v-if和v-show的区别
v-else
1.6列表渲染指令
vue提供了v-for列表渲染指令,用来辅助开发者基于-个数组来循环渲染一个列表结构。
v-for中的索引
使用key维护列表的状态
key的注意事项
2.过滤器
过滤器(Filters) 是vue 为开发者提供的功能,常用于文本的格式化。过滤器可以用在两个地方:插值表达式和v-bind 属性绑定
2.1定义过滤器
2.2私有过滤器和全局过滤器
2.3连续调用多个过滤器
2.4过滤器传参
2.5过滤器的兼容性