vue中动态改变类名，样式不随着改变

在 Vue 中，您可以使用 `v-bind:class` 指令来动态绑定类名，同时使用计算属性来决定类名绑定的值。

例如，您可以在模板中使用以下代码：

<div v-bind:class="{ 'my-class': isClassActive }">默认值</div>

在这个例子中，`v-bind:class` 绑定了一个对象，对象的键是类名，值是一个布尔值，用于判断是否应该应用该类名。在这种情况下，如果 `isClassActive` 为 `true`，则应用 `my-class` 类名，否则不应用。

接下来，在您的 Vue 实例中，您可以使用以下代码创建一个计算属性：

new Vue({
  el: '#app',
  data: {
    isClassActive: false
  },
  computed: {
    classObject: function () {
      return {
        'my-class': this.isClassActive
      }
    }
  }
})

在这个例子中，`classObject` 计算属性返回一个对象，对象的键是类名，值是一个布尔值，用于判断是否应该应用该类名。在这种情况下，如果 `isClassActive` 为 `true`，则应用 `my-class` 类名，否则不应用。

当 `isClassActive` 的值改变时，`classObject` 的值也会相应地改变，从而动态地改变类名，但不会影响元素的样式。