uniapp动态绑定style的背景色和字体颜色
时间: 2023-12-03 16:04:02 浏览: 406
动态改变字体颜色
可以使用v-bind动态绑定style属性来实现uniapp中动态修改背景色和字体颜色,具体代码如下:
<template>
<view class="container" v-bind:style="{ backgroundColor: bgColor, color: textColor }">
<text>{{ message }}</text>
</view>
</template>
<script>
export default {
data() {
return {
message: 'Hello world!',
bgColor: 'red',
textColor: 'white'
}
}
}
</script>
在上述代码中,我们使用v-bind指令将样式属性动态绑定到bgColor和textColor变量上。当这两个变量的值改变时,视图中的背景色和字体颜色也会相应地改变。
阅读全文