.branchWA{
.branchRadius{
border-radius: 79rpx !important;
justify-content:left !important;
position: absolute !important;
.fs_b{
width: 5em;
}
}
.branchRadius_bgZero{
background-color: #f6eee8 !important;
width:216rpx;
height:79rpx !important;
padding-left:11rpx !important;
image{
width: 60rpx !important;
height:60rpx !important;
}
}
.branchRadius_bgOne{
background-color: #fbe7e5 !important;
width:216rpx;
height:79rpx !important;
left:268rpx;
padding-left:11rpx !important;
image{
width: 60rpx !important;
height:60rpx !important;
}
}
.branchRadius_bgTwo{
background-color: #fffae8 !important;
width:216rpx;
height:79rpx !important;
left:512rpx;
padding-left:11rpx !important;
image{
width: 60rpx !important;
height:60rpx !important;
}
}
.branchRadius_bgThree{
background-color: #fbe7e5 !important;
width:216rpx;
height:79rpx !important;
top:157rpx;
left:44rpx;
padding-left:11rpx !important;
image{
width: 60rpx !important;
height:60rpx !important;
}
}
.branchRadius_bgFour{
background-color: #f6eee8 !important;
width:407rpx;
height:148rpx !important;
font-size: 46rpx !important;
top:162rpx;
left:320rpx;
padding-left:21rpx !important;
image{
width: 112rpx !important;
height:112rpx !important;
}
}
.branchRadius_bgFive{
background-color: #f6eee8 !important;
width: 285rpx;
height:105rpx !important;
font-size: 34rpx !important;
top:275rpx;
left:22rpx;
padding-left:16rpx !important;
image{
width: 78rpx !important;
height:78rpx !important;
}
}
.branchRadius_bgSix{
background-color: #fffae8 !important;
width:216rpx;
height:79rpx !important;
top:410rpx;
left:224rpx;
padding-left:11rpx !important;
image{
width: 60rpx !important;
height:60rpx !important;
}
}
.branchRadius_bgSeven{
background-color: #fbe7e5 !important;
width:216rpx;
height:79rpx !important;
top:344rpx;
left:467rpx;
padding-left:11rpx !important;
image{
width: 60rpx !important;
height:60rpx !important;
}
}
}
原先使用数字做为尾标，用于区分各个元素的class样式： <van-button size="small" noline custom-class="
branchRadius branchRadius_bg{{ itd % 8 }}"
@tap="gtRedirect('/pages/branchdetail', { Id: Id })">这个在小程序上没有问题，但是在手机上class样式会显示不出来。
改成
<van-button size="small"
noline custom-class="getClassName" @tap="gtRedirect('/pages/branchdetail', { Id: Id })">
computed:{
getClassName(){
var bg="";
switch(this.itd%8){
case 0:
bg="branchRadius_bgZero";break;
case 1:
bg="branchRadius_bgOne";break;
case 2:
bg="branchRadius_bgTwo";break;
case 3:
bg="branchRadius_bgThree";break;
case 4:
bg="branchRadius_bgFour";break;
case 5:
bg="branchRadius_bgFive";break;
case 6:
bg="branchRadius_bgSix";break;
default:
bg="branchRadius_bgSeven";
}
return "branchRadius "+bg;
}
}
后样式显示成功。
0 个评论
要回复文章请先登录或注册