美文网首页
微信小程序使用weui的mp-checkbox要怎么修改ext-

微信小程序使用weui的mp-checkbox要怎么修改ext-

作者: 好好学习__天天向上 | 来源:发表于2022-12-13 11:44 被阅读0次

    通过调试器找到要修改的属性名字

    image.png
    image.png 把要修改的属性写到weui的checkbox开放的属性ext-class里,再在wxss里修改即可。
    weui链接地址:Checkbox-group和Checkbox | wechat-miniprogram / weui
    <mp-checkbox-group prop="radio" multi="{{false}}" bindchange="radioChange">
          <mp-checkbox wx:for="{{radioItems}}" wx:key="value" class="{{item.disable?'disable-class':''}}" label="{{item.name}}" value="{{item.value}}" checked="{{item.checked}}" ext-class=".checkbox--weui-check[checked]+.checkbox--weui-icon-checked weui-cell__bd"></mp-checkbox>
        </mp-checkbox-group>
    
    data: {
        radioItems: [
          { name: '单选选项一', value: '0', checked: true },
          { name: '单选选项二', value: '1' },
        ],
    
     .checkbox--weui-check[checked]+.checkbox--weui-icon-checked {
          color: var(--main-color);
        }
    
        .weui-cell__bd {
          font-size: var(--font-size-md);
        }
    
        .disable-checkbox {
          color: #999;
          pointer-events: none;
        }
    

    相关文章

      网友评论

          本文标题:微信小程序使用weui的mp-checkbox要怎么修改ext-

          本文链接:https://www.haomeiwen.com/subject/hxaqqdtx.html