ricardoarg
3702
7
Vue

Vue: set focus to input created by v-for

Posted 3 years ago by ricardoarg

say you have something like this, where you have a simple button to add an objec to an array, and a v-for for editing all that options in the array.

How do you set the focus to the newly created input when the user press addOption ?

app.js

var vm = new Vue({
    el: 'body',
    data: {
        myoptions: []
    },
    methods: {
        addOption: function() {
            this.myoptions.push({description: ''});
        }
    }
});
.........

index.html

<button type="button" v-on:click="addOption">Add Option</button><br>
<table>
    <tr v-for="option in options">
        <td><input type="text" v-model="option.description"></td>
    </tr>
</table>

Please sign in or create an account to participate in this conversation.