vue 怎样做到点击一个input就只有它下面的icon显示，而不是所有都显示

Question

<div class="line">

  <div>{{ lists.nick }}</div>

  <div class="light_color">

    <input @focus="focus" @blur="blur" v-model="nick"><!--paremeter.nick--><!---->

    <i @click="clear" class="iconfont icon-iconziti56"></i>

  </div>

</div>

<div class="line">

  <div>{{ lists.valid_mobile }}</div>

  <div class="light_color" v-if="paremeter.valided_mobile == 0">

    <input @focus="focus" @blur="blur" v-model="paremeter.valid_mobile">

    <i @click="clear" class="iconfont icon-iconziti56"></i>

  </div>

  <div v-else class="light_color">

    {{ paremeter.valid_mobile }}

  </div>

</div>

Answer 1

&nbsp; &nbsp; <div id="app">&nbsp; &nbsp; &nbsp; <input type="text" v-model='nick'>&nbsp; &nbsp; &nbsp; <span v-show='show'>DEMO</span>&nbsp; &nbsp; </div>&nbsp; &nbsp; <script>&nbsp; &nbsp; new Vue({&nbsp; &nbsp; &nbsp; el:'#app',&nbsp; &nbsp; &nbsp; data:{&nbsp; &nbsp; &nbsp; &nbsp; nick:''&nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; computed:{&nbsp; &nbsp; &nbsp; &nbsp; show(){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(this.nick.length > 5) return true;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; else return false;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; })&nbsp; &nbsp; </script>