Comment implémenter la fonction de tabulation dans Vue le plus simple

Dans notre développement, notamment sur le terminal mobile, une exigence comme tab doit être fréquemment rencontrée, alors comment peut-on simplement implémenter une telle fonction?

De nombreuses chaussures pour enfants diront certainement que c'est très simple, lorsque l'image de page cliquée ou localisée est remplacée par une image d'effet cliquée, puis chaque partie est copiée, cela peut être réalisé, mais c'est très gênant. Ci-dessous, je présente une implémentation simple d'une méthode plus simple

<template>
	  <ul class="nav">
		   <li v-for="(item,index)" in list :key="index" @click="tab(index)">
		       <img	:src="item.clickImg" alt="logo' v-if="index===nowIndex">
		       <img	:src="item.imgurl  alt="logo' v-else>
		       <span>{
   
   {item.name}}</span>
		   </li>
	 </ul>
</template>
<script>
    import Weixin from './images/weixin.png'
    import Weixins from './images/weixin-s.png'
    import AddressBook from './images/addressBook .png'
    import AddressBooks from './images/addressBook-s.png'
    import Discover  from './images/discover.png'
    import Discovers  from './images/discover-s.png'
    import Mine from './images/mine.png'
    import Mines from './images/mine-s.png'
  export default{
      data(){
           return{
             nowIndex:0,
             list:[
	             {
	               name:"微信“，
	               imgUrl:Weixin  ,
	               clickImg:Weixins 
	              },
	                 {
	               name:"通讯录“，
	               imgUrl:AddressBook ,
	               clickImg:AddressBooks 
	              },
	                 {
	               name:"发现“，
	               imgUrl:Discover ,
	               clickImg:Discovers 
	              },
	                 {
	               name:"我“，
	               imgUrl:Mine,
	               clickImg:Mines
	              }
           ]
           }
          },
          methods:{
             tab(index){
               this.nowIndex=index
             }
          }
        }
</script>