Shulou(Shulou.com)05/31 Report--

This article mainly explains "click in vue2.0 click on the current li how to dynamically switch class", interested friends may wish to have a look. The method introduced in this paper is simple, fast and practical. Next let the editor to take you to learn "vue2.0 click click on the current li how to achieve dynamic switching class" bar!

1, file content

-/ / add attributes that do not exist for item, you need to use the Vue.set (object, key, value) method provided by vue.

{{item.select}} when I am the icon import Vue from 'vue' export default {data () {return {active: false, items: [{first line of select:''} {select:' second line'}, {select:' third line'}, {select:' fourth line'}, methods: {selectStyle (item) Index) {this.$nextTick (function () {this.items.forEach (function (item) {Vue.set (item,'active',false)) }); Vue.set (item,'active',true);});}} .active {color:red;} .inactive {color:#000;} .icon {float: right; font-size:12px;}

2, effect

At this point, I believe that everyone on the "vue2.0 click click on the current li how to achieve dynamic switching class" have a deeper understanding, might as well to the actual operation of it! Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.