1. 表单录入糖
<!-- 自动转为数值类型 -->
<input v-model.number="age" type="number">
<!-- 自动去除首尾空白字符 -->
<input v-model.trim="username">
<!-- 延迟同步，直到失去焦点 -->
<input v-model.lazy="searchQuery">
2. 事件糖
<!-- 阻止默认行为 -->
<form @submit.prevent="onSubmit"></form>
<!-- 阻止事件冒泡 -->
<button @click.stop="doThis"></button>
<!-- 修饰符可以串联 -->
<a @click.stop.prevent="doThat"></a>
<!-- 按键系统修饰符 -->
<button @click.ctrl="doSomething"></button>
3、动态组件糖
<component :is="currentComponent"></component>
4、父子通讯糖
// 父组件
provide() {
return { theme: 'dark' };
}
// 子组件
inject: ['theme']