uniapp的js控制css

在UniApp中，可以使用Vue.js提供的绑定语法来控制CSS。具体来说，可以通过以下方式：

1. 通过v-bind绑定样式对象

可以使用v-bind指令将一个对象绑定到元素的style属性上。这个对象的每个属性都表示一个CSS属性，属性值表示CSS属性的值。例如：

<template>
  <div :style="myStyle">Hello, UniApp!</div>
</template>

<script>
export default {
  data() {
    return {
      myStyle: {
        color: 'red',
        fontSize: '20px',
        backgroundColor: 'yellow'
      }
    }
  }
}
</script>

在上面的例子中，div元素的文本颜色是红色，字体大小为20像素，背景色为黄色。

2. 通过计算属性绑定样式类名

可以通过计算属性来动态绑定样式类名。例如：

<template>
  <div :class="myClass">Hello, UniApp!</div>
</template>

<script>
export default {
  data() {
    return {
      isRed: true
    }
  },
  computed: {
    myClass() {
      return this.isRed ? 'red-text' : 'blue-text'
    }
  }
}
</script>

<style>
.red-text {
  color: red;
}
.blue-text {
  color: blue;
}
</style>

在上面的例子中，如果isRed的值为true，则div元素的文本颜色为红色；否则为蓝色。在样式中定义了两个类名，分别对应红色和蓝色的文本颜色。

除了上述方法，UniApp还支持在组件样式中使用JavaScript表达式和条件语句。例如：

<template>
  <div class="my-class" :style="{ color: isActive ? 'red' : 'blue', fontSize: fontSize + 'px' }">Hello, UniApp!</div>
</template>

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

<style>
.my-class {
  background-color: yellow;
}
</style>

在上面的例子中，div元素的文本颜色和字体大小都是动态计算的，根据isActive和fontSize的值不同而变化。同时，div元素的背景颜色为黄色。