请简述Vue事件绑定原理 ？

Vue.js 的事件绑定基于 DOM 的事件模型，但它提供了更高级的抽象和更多的功能。

在 Vue.js 中，我们可以使用 v-on 指令或 @ 简写来在元素上绑定事件监听器。这个监听器可以是一个方法名，也可以是一个内联 JavaScript 表达式。

例如：

<button v-on:click="sayHello">Say hello</button>
<button @click="sayHello">Say hello</button>

在这个例子中，当按钮被点击时，Vue.js 会调用 sayHello 方法。

当 Vue.js 处理这个模板时，它会使用 addEventListener 方法在这个元素上添加一个事件监听器。当事件被触发时，Vue.js 会调用相应的方法或表达式。

Vue.js 还提供了一些修饰符来控制事件的行为，例如 .stop、.prevent、.capture、.self、.once、.passive 等。

例如：

<button @click.stop="sayHello">Say hello</button>

在这个例子中，.stop 修饰符会阻止事件冒泡，也就是说，事件不会传递给父元素。

总的来说，Vue.js 的事件绑定原理是基于 DOM 的事件模型，但它提供了更简单和强大的方式来处理事件。我们可以很容易地在元素上添加事件监听器，控制事件的行为，以及在事件触发时执行我们的代码。