如何让 vue.js 中的 onclick 事件只工作一次

Question

这是仅调用一次 onclick 事件的正常 javascript 代码：

<button onclick="myFunction(); this.onclick=null;">This button works only once</button>
<button onclick="myFunction()">This button works always</button>
<script>
    function myFunction() {
        console.log("hello");
    }
</script>
</body>

普通 javascript 的技巧是这样的：

<button onclick="myFunction(); this.onclick=null;">

但是，现在我想在 vue.js 中使用此功能，并且 vue.js 中的按钮如下所示：

 <input
     type="submit"
     value="Start"
     name="start_button"
     @click="start"
 />

谁能建议我如何在 vuejs 中调用一次事件......

Answer 1

使用.once事件修饰符只处理一次事件：

<input @click.once="start">

演示