<div id="app">
<button @click="share('share info', $event)">share</button>
</div>
var app = new Vue({
el: '#app',
data() {
return {
user: {
name: 'xxx'
}
}
},
methods: {
share (info, event) {
console.log(info, event)
}
},
})
如例子所示，可以用特殊变量$event把它传入方法
once、passive事件修饰符
Vue中提供了多个事件修饰符， once、passive是后面新增的两个，once用于限定事件只触发一次，passive用于修饰的事件发生后立即触发，用于提升移动端性能
表单输入修饰符
.lazy
在默认情况下，v-model在每次input事件触发后将输入框的值与数据进行同步，可以添加lazy修饰符，从而转变为使用change事件进行同步，举个例子：
<input placeholder="lazy" v-model.lazy="msg" @input="input" @change="change">
.number
如果想自动将用户的输入值转为数值类型，可以给v-model添加number修饰符，这通常很有用，因为即使在type=”number”时，HTML输入元素的值也总会返回字符串。如果这个值无法被 parseFloat()解析，则会返回原始的值，举个例子：
<input placeholder="number" v-model.number="age" @input="input">.trim
如果要自动过滤用户输入的首尾空白字符，可以给v-model添加trim修饰符，举个例子：
<input placeholder="trim" v-model.trim="trim" @input="input">
子组件替换/合并已有的特性
在Vue中对于绝大多数特性来说，从外部提供给组件的值会替换掉组件内部设置好的值。所以如果传入type=”text”就会替换掉 type=”date”并把它破坏！庆幸的是，class和 style特性会稍微智能一些，即两边的值会被合并起来，从而得到最终的值，举个例子：
<div id="app">
<base-input type="text" class="out"></base-input>
</div>
Vue.component('base-input', {
template: `<input type="date" placeholder="replace" class="default">`
})
new Vue({
el: '#app',
})
在上例中input的type值为date，class为deafault，在使用子组件时，向子组件中传入type=”text” class=”out”，此时input的type值会被替换为text，class值会被合并为”default out”，那么如果想要禁用属性继承怎么办呢？可以在组件的选项中设置inheritAttrs:false，举个例子：
