发现一个比较复杂的样式不清除的bug

C-Chicken

经过测试， border-radius 中的数值无法清除， 额外在 其他样式中写了 border-radius：0； 这种写法也是无效
同样的代码，在H5，及小程序端能正常使用， ios及安卓都有这个问题

下面是碰到错误的示例图




下面是代码：

1. <template>
   
2.         <view class="_page">
   
3.                 <scroll-view scroll-y="true" show-scrollbar="false" bounces="false" class="b-fff">
   
4.                         <view v-for="(item,index) in list"
   
5.                         :key="index"  
   
6.                         :class="'height-59 ' +
   
7.                         (index == select_index ? 'b-fff ':'b-F2F2F7 ') +
   
8.                         (index == select_index - 1 ? 'right-down-border-radius ':'') +
   
9.                         (index == select_index + 1 ? 'right-top-border-radius ':'')"  
   
10.                         @click="select(index)">
    
11.                         <text>{item.title}</text>
    
12.                         </view>
    
13.                 </scroll-view>
    
14.         </view>
    
15. </template>
    
16. <script>
    
17. export default {
    
18.         name: 'directory-list',
    
19.         apiready() {//like created
    
20. 
    
21.         },
    
22.         data() {
    
23.                 return {
    
24.                         select_index: 0,
    
25.                         list: [{
    
26.                                 title: "一级类目",
    
27.                                 id: 0
    
28.                         }, {
    
29.                                 title: "一级类目",
    
30.                                 id: 1
    
31.                         }, {
    
32.                                 title: "一级类目",
    
33.                                 id: 2
    
34.                         }, {
    
35.                                 title: "一级类目",
    
36.                                 id: 3
    
37.                         }, {
    
38.                                 title: "一级类目",
    
39.                                 id: 4
    
40.                         }, {
    
41.                                 title: "一级类目",
    
42.                                 id: 5
    
43.                         }, {
    
44.                                 title: "一级类目",
    
45.                                 id: 6
    
46.                         }]
    
47.                 }
    
48.         },
    
49.         methods: {
    
50.                 select(index) {
    
51.                         this.data.select_index = index;
    
52.                         // this.fire("checked", this.props.list[index]);
    
53.                 }
    
54.         }
    
55. }
    
56. </script>
    
57. 
    
58. <style scoped>
    
59. .b-F2F2F7 {
    
60.         background: #f2f2f7;
    
61. }
    
62. .b-fff {
    
63.         background: #fff;
    
64. }
    
65. .active-icon {
    
66.         width: 3px;
    
67.         height: 13px;
    
68.         position: absolute;
    
69.         left: 0;
    
70.         top: 0;
    
71.         bottom: 0;
    
72.         margin: auto;
    
73. }
    
74. .active-text {
    
75.         font-family: PingFangSC-Medium, PingFang SC;
    
76.         font-weight: 500;
    
77. }
    
78. .nomarl-text {
    
79.         font-family: PingFangSC-Regular, PingFang SC;
    
80.         font-weight: 400;
    
81. }
    
82. .clear {
    
83.         border-radius: 0;
    
84. }
    
85. .right-down-border-radius {
    
86.         border-radius: 0 0 10px 0;
    
87. }
    
88. .right-top-border-radius {
    
89.         border-radius: 0 10px 0 0;
    
90. }
    
91. .height-40 {
    
92.         height: 40px;
    
93. }
    
94. .height-20 {
    
95.         height: 20px;
    
96. }
    
97. .text {
    
98.         font-size: 14px;
    
99.         line-height: 20px;
    
100. }
     
101. .height-59 {
     
102.         height: 59px;
     
103.         width: 100%;
     
104. }
     
105. ._page {
     
106.         width: 86px;
     
107.         height: 100%;
     
108.         background: #f2f2f7;
     
109. }
     
110. </style>
     

复制代码

杨永安

已经反馈给相关技术。

C-Chicken

感谢大佬的辛苦回复，已经找到暂时解决这个bug 的 临时方法， border-radius 当参数从 大于0 的改变为0 的时候， 是不生效的，但是当改变为一个 趋近于0 的一个值，那么是生效的

杨永安 · 2021-11-30 11:34已经反馈给相关技术。