如何从 VueJs 中的选定元素中删除特定的类名？答案

【问题标题】：How to remove particular class name from an selected element in VueJs?如何从 VueJs 中的选定元素中删除特定的类名？
【发布时间】：2018-11-09 00:33:58
【问题描述】：

这就是我的 vuejs 方法的样子。在 changeRoute 函数中，我可以通过e.target.className = 'clicked'; 更改类名但是当我尝试从其他元素中删除该类名时，我无法通过pre.removeClass('clicked'); 来完成此操作？

<script>   
export default {

  components: { 
      
  },
  data() { 
      return {

      }
  },
  methods: {
      changeRoute(e, route) {
           
        var pre = this.$el.querySelector('.clicked');
        if(pre) {
            // pre.removeClass('clicked'); 
        }

        this.$router.push({
            name: route
        }); 
        e.target.className = 'clicked';
          
      }
  },
  mounted() {
      this.$nextTick(() => {
 
      })
  }
}

</script>

还有如何推送类名而不是全部替换为e.target.className = 'clicked';

【问题讨论】：

标签： javascript css css-selectors vuejs2 vue-component

【解决方案1】：

您可以为此使用classList.add and classList.remove。
但是您似乎想根据当前路由设置链接样式，这可以使用 vue-router 完成，因为它会在与当前路由匹配的链接上添加类。
Vue-router active class

【讨论】：

非常感谢。实际上我想知道在函数中这样做的方式。 :)
很高兴我能帮助@SwadhIn

【解决方案2】：

使用实际的 Vue 来完成这个任务。我可以在这里解释一下，但是 Vue 页面做得很好。

https://vuejs.org/v2/guide/class-and-style.html

【讨论】：

我知道这种技术，但我想知道如何在 vue 函数中做到这一点。

【解决方案3】：

如果所选元素是 li 列表的一部分并且应该添加类（并因此从先前单击的 li 中删除），这是 Herteby 在VueJS Forum 上的一个很好的解决方案

https://forum.vuejs.org/t/how-to-add-active-class-to-element/28108/2

【讨论】：