How to show and hide input as per sibling input value in vue js.
Advertisement
Answer
You can use v-show in the input and pass the sibling v-model value in it to check if it contains value or not.
In below demo, we are showing the input if sibling input have alpha value. You can add condition as per your requirement.
new Vue({
el: '#app',
data: {
input1: null,
input2: null
}
})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="app"> <input type="text" v-model="input1" placeholder="Input 1"/> <input type="text" v-show="input1 === 'alpha'" v-model="input2" placeholder="Input 2"/> </div>