---

一、表单

1. 复选框checkbox

使用true-value和false-value，可以将布尔值进行隐性的转换。

<input type="checkbox" v-model="flag" true-value="1" false-value="0">
1

2. v-model的原理

<input type="text" v-model="msg">
1

可以解析为：

<input type="text" :value="msg" @input="msg = $event.target.value">
1

二、组件传值

1. 绑定事件的命名必须大写

错误写法：my-event（这样写会导致该方法无效）

<Son @my-event="handler" />
1

正确写法：myEvent

<Son @myEvent="handler" />
1

2. .sync修饰符

可以变更从父组件传到子组件的值，对prop进行 双向绑定：

父组件：

<Son :msg.sync="msg" />
1

子组件：

this.$emit('update:msg','new message')
1

此时，msg在父组件和子组件中的值都变更为 new message。

三、动态组件的is属性

通常用于tab切换：

// keep-alive标签用来保持组件状态，避免重复渲染
<keep-alive>
	<div is="tabComponent"></div>
</keep-alive>
1
2
3
4

---

总结

对vue2.x一些项目中遇到的知识点进行总结。