@click和v-on：click Vuejs之间的区别

阿飞古一A2020-03-09

问题应该足够清楚:)。但我可以看到有人在使用：

<button @click="function()">press</button>

有人使用：

<button v-on:click="function()">press</button>

但实际上两者之间有什么区别（如果存在）

Tony小卤蛋2020/03/09 23:38:42

两者之间没有区别，一个只是第二个的简写。

v前缀用作视觉提示，用于标识模板中特定于Vue的属性。当您使用Vue.js将动态行为应用于某些现有标记时非常有用，但对于某些常用指令可能会感到冗长。同时，在构建由Vue.js管理每个模板的SPA时，对v-前缀的需求变得不那么重要。

<!-- full syntax -->
<a v-on:click="doSomething"></a>
<!-- shorthand -->
<a @click="doSomething"></a>

资料来源：官方文档。

Itachi小宇宙2020/03/09 23:38:42

它们看起来可能与普通的HTML有所不同，但是：和@是属性名称的有效字符，所有受Vue.js支持的浏览器都可以正确解析它。此外，它们不会出现在最终的渲染标记中。速记语法完全是可选的，但是稍后您将进一步了解其用法时，可能会喜欢它。

资料来源：官方文档。

Newest Answer