Click vue cycle change color

<template>
    <div>
       <div v-for='(item,index) in arr' 
            v-bind:class='{bg:index==isactive}'
            @click='fn(index)'>
            {{item}}
       </div>
    </div>
  </template>
   
  <script>
    export default {
      data() {
        return {
             isactive:0,
             arr:['111','222','333','444']
        }
      },
      methods: {
        fn:function(index){
            console.log(index);
            this.isactive=index;
        }
      },
    }
  </script>
   
  <style scoped>
    / * Click on the text change color * /
    .bg{
        color:pink;
    }
  </style>
   

  

Guess you like

Origin www.cnblogs.com/fei3/p/12000923.html