style="max-width:{{product.buySwitch == '2'?'calc(100% - 100rpx)':'100%'}}" 转uniapp格式

<>
<view
:style="{
'max-width': product.buySwitch === '2' ? 'calc(100% - 100rpx)' : '100%'
}"
>
<!-- 此处为组件内容 -->
</view>
</template>

相关问题

<view class="rega" v-if="isActive==1"> <text style="margin: 10px;">热门城市</text> <view class="cities" v-for="(item,index) in hotcities" :key="index"> <view class="hotcitiesitem" >{{item.names}}</view> </view> </view> .rega { height: 100%; width: 100%; } .hotcitiesitem { width: 23%; margin: 5px; border: 1px solid #ccc; border-radius: 20rpx; text-align: center; }要求在显示的页面上每一行能显示四个元素，以贡献是两行，

可以将`.hotcitiesitem`的宽度设为`calc(25% - 10px)`，同时将`.cities`的宽度设为`100%`，并给`.cities`添加`display:flex`和`flex-wrap:wrap`属性，这样每一行就能显示四个元素了，如下所示：

.rega {
  height: 100%;
  width: 100%;
}
.cities {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.hotcitiesitem {
  width: calc(25% - 10px);
  margin: 5px;
  border: 1px solid #ccc;
  border-radius: 20rpx;
  text-align: center;
}