about.vue 518 B

1234567891011121314151617181920212223
  1. <template>
  2. <div :class="['static-class', { 'dynamic-class1': condition1, 'dynamic-class2': condition2 }]">
  3. 这是一个元素
  4. </div>
  5. </template>
  6. <script>
  7. export default {
  8. data() {
  9. return {
  10. condition1: false,
  11. condition2: false,
  12. };
  13. },
  14. watch: {
  15. // 假设某个值变化时触发条件判断
  16. someValue() {
  17. this.condition1 = this.someValue > 10;
  18. this.condition2 = this.someValue < 5;
  19. },
  20. },
  21. };
  22. </script>