Click on the event to change the value of the data in data, control the page style, and report an error.

<ul>
   <li v-on:click="chooseTab" v-bind:class="{active: chooseTab ==""}"><a href="javascript:;"></a></li>
   <li v-on:click="chooseTab" v-bind:class="{active: chooseTab ==""}"><a href="javascript:;"></a></li>
   <li v-on:click="chooseTab" v-bind:class="{active: chooseTab ==""}"><a href="javascript:;"></a></li>
   <li v-on:click="chooseTab" v-bind:class="{active: chooseTab ==""}"><a href="javascript:;"></a></li>
</ul>
var app = new Vue({
    el: "-sharpvue-app",
    data: {
      chooseTab: ""
    },
    methods: {
       chooseTab: function(event) {
           var el = event.currentTarget;
           this.chooseTab = el.innerText;
       }
   }
})

Click the first time to work, and click the second time to report an error

clipboard.png

Thank you for your answer, thank you.

Jul.22,2021
The naming of

data.chooseTab and methods.chooseTab conflicts

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1e468c9-44bb4.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1e468c9-44bb4.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?