除了直接绑定到一个方法,也可以用内联 JavaScript 语句:
HTML代码:
<div id="example-3"> <button v-on:click="say('hi')">Say hi</button> <button v-on:click="say('what')">Say what</button> </div>
JS代码:
new Vue({ el: '#example-3', methods: { say: function (message) { alert(message) } } })
结果:
有时也需要在内联语句处理器中访问原生 DOM 事件。可以用特殊变量$event
把它传入方法:
HTML代码:
<button v-on:click="warn('Form cannot be submitted yet.', $event)">Submit</button>
JS代码:
// ... methods: { warn: function (message, event) { // 现在我们可以访问原生事件对象 if (event) event.preventDefault() alert(message) } }