写博客是思考的过程
样式与遍历
计算属性
具有依赖关系的数据监听
computed: {
b: function() {
return a + c
}
}
样式
:class=[a1, a2]
data() {
return {
a1: aaa,
b1: bbb
}
}
:class="{ 'test1': a3 }"
data() {
return {
a1: true
}
}
:class=obj
data() {
return {
test1: true || false
}
}
遍历
v-for= "(item, idx) in List" :key="item"
key 是用来提高性能的, vue会根据key来判断某些没有发生变化的节点,复用。
遍历的分组用法
<template for="item in List">
<li :key="item + 1">Hello</li>
<li :key="item">{{item}}</li>
</template>
事件
定义和缩写
定义: v-bind:click="eventName"
缩写: @click="eventName"
传参数
@click="eventName(param, $event)"
- param 就是传的参数
- $event 是事件对象
修饰符
- stop 阻止事件冒泡
- prevent 阻止默认事件
- capture 开启捕获模式
- self
- once 事件只执行一次
- passive
键盘事件
:keyup.13="eventName"