l***@163.com
l***@163.com
  • 发布:2022-08-03 18:59
  • 更新:2022-08-04 10:06
  • 阅读:529

radio选框无法居中,如何居中?

分类:uni-app

使用radio-group时,选项是从后台获取的,选项的高度没有设置,如何使选框居中呢?代码如下

    <radio-group>  
                    <label class="uni-list-cell uni-list-cell-pd" v-for="(item,index) in addressList" :key="index"  @click="chooseAddress(item)">  
                        <div class="radio-icon">  
                            <radio :value="item.id"  :checked="item.defaultAddress" />  
                        </div>  
                        <div class="single-address-item">  
                            <div class="address-item">{{item.clientArea}}{{item.clientAddress}}  
                                <!--     -->  
                                <div v-if="!item.flash&&item.addBounty" class="address-item-flash">(距默认地址{{item.kilometers}}公里,每公里追加赏金{{item.bountyNumber}}元)</div>  
                                <div v-if="item.flash" class="address-item-flash">(需要叫闪送)</div>  
                                <div v-if="!item.flash&&item.bounty!=null&&item.bounty!=''" class="address-item-flash">(赏金{{item.bounty}}元)</div>  
                            </div>  

                            <div> {{item.clientName}} {{item.clientPhone}}</div>  
                        </div>  
                        <image src="../../static/image/edit.png" class="edit-image"></image>  
                        <div style="height: 20px;width: 100%;"></div>  
                    </label>  

                </radio-group>
    .radio-icon{  
        margin-left: 10px;  
        display: inline-flex;  
        text-align: center;  

    }  
    .single-address-item{  
            margin-left: 15px;  
            display: inline-block;  
            width: 70%;  
    }  
    .edit-image{  
        display: inline-block;  
        width: 20px;  
        height: 20px;  
    }

这个应该怎么修改

2022-08-03 18:59 负责人:无 分享
已邀请:
DCloud_UNI_WZF

DCloud_UNI_WZF

水平居中还是垂直居中,请详细描述你的需求并提供可运行最简demo,注意不要耦合业务代码

要回复问题请先登录注册