[Vuejs]-Toggle hide on v-for item's child DOM element

by

0👍

✅

Add an editing property to each item. Then

<span class="hover-on-click-input" @click="item.editing = true">{{item.content.name}}</span>
<input v-if="item.editing" class="form-control hidden" type="text" :value="item.content.name" @blur="updateInfo(item, 'author', $event.target.value)">

And set item.editing = false in updateInfo.

Leave a comment