ios在VUE按数据切换视图中的class控制样式时,background丢失问题

复制代码
<dl>
              <dd
                v-for="(floors, index2) in item.floors"
                :key="'dd'+activeName + '' + item.unitId + 'floor'+floors.floor+ 'index'+index + index2"
              >
                  <div
                    :class="{bnt: true, check: floors.isComplete === 1, disabled: floors.status !== 0}"
                    @click="floorsClick(floors)"
                  >{{ floors.floor }}层</div>
              </dd>
            </dl>

.bnt {
                margin: 0 0 5px 5px;
                 border-radius: 5px;
                color: #fff;
                text-align: center;
                width: 50px;
                height: 14px;
                line-height: 14px;
                background-color: #ffd2b9 !important;
                &.check {
                  color: #fff;
                  border: none;
                  background-color: #f99d33 !important;
                }
                &.disabled {
                  cursor: not-allowed;
                }
              }                
复制代码

在ios16下发现border-radius: 5px和background-color: #ffd2b9放在一起时,经过多次测试在切换class来变化样式时,background就会失效,在外侧增加一个div做border-radius加overflow: hidden;进行替换便可修复

 

posted @   me春天  阅读(81)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· C#/.NET/.NET Core优秀项目和框架2025年2月简报
· 一文读懂知识蒸馏
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
历史上的今天:
2014-03-03 photoshop的页面制作练习1
点击右上角即可分享
微信分享提示