事件名:始终使用 kebab-case 的事件名
不同于组件和 prop，事件名不存在任何自动化的大小写转换。而是触发的事件名需要完全匹配监听这个事件所用的名称
不同于组件和 prop，事件名不会被用作一个 JavaScript 变量名或属性名，所以就没有理由使用 camelCase 或 PascalCase 了。
v-on
v-on:myEventv-on:myeventmyEvent
v-model:model选项设置绑定的prop和事件
v-model本身就是要处理！
$listeners，它是一个对象，里面包含了作用在这个组件上的所有监听器
$listenersv-on="$listeners"将所有的事件监听器指向这个组件的某个特定的子元素
Vue.component('base-input', { inheritAttrs: false, props: ['label', 'value'], computed: { inputListeners: function () { var vm = this // `Object.assign` 将所有的对象合并为一个新对象 return Object.assign({}, // 我们从父级添加所有的监听器 this.$listeners, // 然后我们添加自定义监听器， // 或覆写一些监听器的行为 { // 这里确保组件配合 `v-model` 的工作 input: function (event) { vm.$emit('input', event.target.value) } } ) } }, template: ` <label> {{ label }} <input v-bind="$attrs" v-bind:value="value" v-on="inputListeners" > </label> ` }) v-model
valueinput
model
modelVue.component('base-checkbox', { model: { prop: 'checked', event: 'change' }, props: { checked: Boolean }, template: ` <input type="checkbox" v-bind:checked="checked" v-on:change="$emit('change', $event.target.checked)" > ` }) <base-checkbox v-model="lovingVue"></base-checkbox> propschecked
.sync
单个属性/多个属性:做了很多事情：v-bind:title.sync
在有些情况下，我们可能需要对一个 prop 进行“双向绑定”。不幸的是，真正的双向绑定会带来维护上的问题，因为子组件可以修改父组件，且在父组件和子组件都没有明显的改动来源。
这也是为什么我们update:myPropName取而代之。
this.$emit('update:title', newTitle)//子组件发送,为了配合sync，必须用update:title,"值"这种格式 //父组件接受 <text-document v-bind:title="doc.title" v-on:update:title="doc.title = $event" ></text-document> 为了方便起见，我们为这种模式提供一个缩写，即 .sync 修饰符： <text-document v-bind:title.sync="doc.title"></text-document> this.$emit('update:title', newTitle)//子组件发送,为了配合sync，必须用update:title,"值"这种格式 
.syncv-bind
<text-document v-bind.sync="doc"></text-document>组件内：像下面这样写,这样父元素就能自动监听元素
doctitlev-on。
