Vue
2016-10-22 22:07:37 0 举报
AI智能生成
vue相关知识点整理
作者其他创作
大纲/内容
Vue实例
构造器构造:var vm = new Vue({})
生命周期
计算属性(Computed)
条件渲染
v-if
v-else
template v-if
v-show
方法与事件处理器
v-on 监听dom事件
事件修饰符 stop & prevent
按键修饰符
过渡
transition
概述
视图层框架
子主题
响应式的数据绑定
原理:针对data用Object.defineProperty转为getter/setter, 然后watcher
组合的视图组件
数据绑定
插值,字面量 or raw html
表达式 | 过滤器
指令(Directives)
职责就是当其表达式的值改变时把某些特殊的行为应用到 DOM 上
参数
修饰符
缩写
Class & Style 绑定
对象语法
<div v-bind:class="{ 'class-a': isA, 'class-b': isB }"></div>
<div v-bind:class="classObject"></div>
<div v-bind:style="{ color: activeColor, fontSize: fontSize + 'px' }"></div>
<div v-bind:style="styleObject"></div>
数据语法
<div v-bind:class="[classA, classB]">
<div v-bind:class="[classA, { classB: isB, classC: isC }]">
<div v-bind:style="[styleObjectA, styleObjectB]">
列表渲染
v-for
数组
$index
对象
$index
$key
值域
<span v-for="n in 10">{{ n }} </span>
template v-for
数组变异与替换
track-by
提供一个唯一标识,提高已有元素的复用性
没有唯一标识,可以track-by="$index"
表单控件绑定
v-model
message
checked
array
picked
selected
number
debounce
lazy
☆组件
创建:var MyComponnent = Vue.extend({});
注册:Vue.compont('my-component', MyComponent)
0 条评论
下一页