HTML是大小写不敏感的,HTML中的属性@addList会被解析为@addlist,js再用@addList去找,是找不到的。
2017-11-27
vue的demo
vue的数据绑定
el属性
v-model与data选项
vue声明周期
created
mounted
beforeDestroy
插值与表达式
最基本的文本插值方法:{{}}
{{}}中,除了最简单的绑定属性外,还可以使用js表达式进行简单的运算,三目运算符等
v-html
过滤器
{{}}插值的尾部添加一个管道符"(|)"对数据进行过滤
通过给vue实例添加选项filters来设置过滤器
过滤器可以串联,也可以接收参数
指令和事件以及语法糖
v-bind:动态更新html元素上的属性,如id,class等,如<img v-bind:src="imgUrl" />
v-on:绑定监听事件,如:<button v-on:click="dealClick"></button>
click事件方法写在methods选项中。
vue代理了data和methods的数据,可以直接通过vue实例访问
语法糖:
v-bind可以直接写个冒号 :href=""
v-on可以直接用@ @click=""
计算属性
2017-11-28
计算属性
计算属性的get和set
计算属性缓存,计算属性与methods的区别
v-bind与class和style的绑定
v-bind指令
绑定class的几种方式:对象语法,数组语法,在组件上使用
绑定内联样式
2017-11-29
内置指令
v-cloak:经常与dispaly:none配合使用
v-once:元素或组件只渲染一次
v-if v-else-if v-else条件渲染
内置<template></template>
vue的key属性
v-show:css的dispaly属性
v-for:<li v-for="book in books">{{book.name}}</li> v-for可以遍历数组,对象
数组更新
过滤与排序:使用计算属性
事件和方法
修饰符
2017-11-30
v-model与表单
绑定:输入框,单选按钮,互斥单选按钮 ,多选按钮,选择列表,
绑定值:单选按钮,复选框,选择列表
修饰符:.lay .number .trim
2017-12-03
组件的用法
props传递数据
单向数据流,父组件向子组件传递数据
组件通信,子组件向父组件传递数据
使用v-model
非父子组件通信