微信小程序---动态显示组件样式

①在.wxml组件中使用style对组件进行设置

<text class="text" style="color: {{setColor ? 'blue':'red'}}">{{t}}</text>

②在.js中，首先在data中定义setColor为false

data: {

setColor: false,

    },

③，在js中根据条件对组件进行相应的更改

 if(g<=q){
          if(d>=h){
            this.setData({
            setColor: true,
            })
              t="文字"
          }
      }else{
        this.setData({
            setColor: false,
            })
        t="文字"
      }

④，效果图

 

搜索

复制