el 是 example
data 必须是一个函数
methods 方法
watch 监听属性
computed 计算属性
component 组件
template 模板
全局注册
Vue.component('component-a', {/* ... */})
Vue.component('component-b', {/* ... */})
Vue.component('component-c', {/* ... */})
newVue({el:'#app'})
<div id="app">
<component-a></component-a>
<component-b></component-b>
<component-c></component-c>
<div>
局部注册
varComponentA = {/* ... */}
varComponentB = {/* ... */}
varComponentC = {/* ... */}
newVue({
el:'#app'
components: {
'component-a': ComponentA,
'component-b': ComponentB
}
})
msg 文本
v-html 原始html
v-text 输出文本
v-bind 属性绑定(单向) 可用:代替
v-model 双向数据绑定(只用于表单)
v-on 绑定事件 可用@代替
事件修饰符
.stop 阻止冒泡
.prevent 阻止默认事件
.capture 添加事件监听器时使用事件捕获模式
.self 只在该元素本身(比如不是子元素时)触发回调函数
.once 只执行一次
v-for 遍历数据
v-if v-show
v-if指令是直接销毁或重建DOM达到让元素显示和隐藏的效果。
v-show指令是通过修改元素display的CSS属性来让其达到显示和隐藏的效果。