jquery - Vuejs display other input fields based on selected value from dropdown -

i have select dropdown list , 2 hidden input fields. when user select first item in dropdown list , first input field gets displayed , vice versa. here code i'm not sure how if statement when selected value equals xxx display input field 1, else display input field 2

new vue({       el: '#app',       data: {                selected: ''              }        }); <select name="parent" class="form-control" v-model="selected" required>       <option value="" selected></option>       <option value="item1">item 1</option>       <option value="item2">item 2</option> </select> <div>    <input name="test 1" v-show="selected"> //display when item 1 selected </div> <div>    <input name="test 2" v-show="selected"> //display when item 2 selected </div> 

thank you

you can like

<div v-if="selected === 'item1'">   item1 selected </div> <div v-else>   else selected. </div> 

if don't want use v-else can do:

<div v-if="selected != 'item1'">   besides item1 selected </div>