@ant-design/react-native 记录一下如何去掉List Item的下划线

本文记录了如何在使用@ant-design/react-native时去掉List Item的下划线。由于下划线是List.Item的特定样式,不能直接通过style覆盖,而是需要通过设置特定属性进行修改。代码示例和更多样式调整可在相关样式文件中查看。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

如何去掉List Item的下划线

此方法我是从ant-design-mobile-rn的issues中找到的,怕自己以后搞忘,现在做一个记录。

首先下划线是List.Item的特定样式,无法通过赋予 style 进行覆盖。

特定样式都是通过styles属性去覆盖。

代码:

          <List.Item
            arrow="horizontal"
            extra='更多'
            style={{ borderBottomWidth: 0 }}
          >
            用style去覆盖并不起作用
          </List.Item>
          <List.Item
            onPress={this.toDeptList}
            styles={{ Line: { borderBottomWidth: 0 } }}
            arrow="horizontal"
            extra='更多'
          >
            设置styles属性才能没有下划线
          </List.Item>

在这里插入图片描述

还有其他想改的特定样式,可以看这里的样式文件。

完。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值