uniapp动态class

在uni-app中，可以使用动态class来根据条件动态地设置元素的class属性。具体的实现方式是在模板中使用三元表达式或计算属性来动态设置class。

以下是示例代码：

<template>
  <div :class="{'active': isActive, 'disabled': isDisabled}">动态class</div>
</template>

<script>
export default {
  data() {
    return {
      isActive: true,
      isDisabled: false
    }
  }
}
</script>

在上述代码中，我们使用了三元表达式来设置class。如果isActive为true，则该元素的class属性中会包含'active'；如果isDisabled为true，则该元素的class属性中会包含'disabled'。这样就可以根据数据动态地设置元素的class属性。

除了使用三元表达式外，还可以使用计算属性来动态设置class。具体的实现方式是在计算属性中返回一个对象，对象中的键表示class名称，值表示是否应该添加该class。

以下是示例代码：

<template>
  <div :class="classObj">动态class</div>
</template>

<script>
export default {
  data() {
    return {
      isActive: true,
      isDisabled: false
    }
  },
  computed: {
    classObj() {
      return {
        'active': this.isActive,
        'disabled': this.isDisabled
      }
    }
  }
}
</script>

在上述代码中，我们定义了一个计算属性classObj，该属性返回一个包含两个键值对的对象。如果isActive为true，则该对象中包含'active'键；如果isDisabled为true，则该对象中包含'disabled'键。这样就可以动态地设置元素的class属性了。