如何在 vue.js 中使用 onfocusout 功能？

Question

我想在光標從一個文本框移動到下一個文本框后立即調用一個函數。 單擊選項卡或輸入預期條目並移至下一個時，應進行函數調用。

Answer 1

使用v-on指令在<input>上添加一個事件監聽器以實現blur或focusout ：

v-on:EVENT_NAME="METHOD"

例子：

<input v-on:blur="handleBlur">

或更短的語法：

@EVENT_NAME="METHOD"

例子：

<input @blur="handleBlur">

 new Vue({ el: '#app', methods: { handleBlur(e) { console.log('blur', e.target.placeholder) }, handleFocusout(e) { console.log('focusout', e.target.placeholder) } } })

 <script src="https://unpkg.com/vue@2.6.14/dist/vue.min.js"></script> <div id="app"> <fieldset> <legend>blur</legend> <input @blur="handleBlur" placeholder="first name"> <input @blur="handleBlur" placeholder="last name"> </fieldset> <fieldset> <legend>focusout</legend> <input @focusout="handleFocusout" placeholder="email"> <input @focusout="handleFocusout" placeholder="phone"> </fieldset> </div>