react native 日常-集成antd-mobile-rn蚂蚁金服插件

antd-mobile-rn阿里开源框架

link. 组件官网

1.常规npm

// 终端内导入组件
npm install antd-mobile-rn --save

2.使用

// 项目内使用组件
import { 需要的组件 } from 'antd-mobile';

3.例如时间选择器

// 该组件时间格式需转换
//import moment from "moment";转换时间
       <DatePicker
            value={moment(时间).toDate()}
            mode="date"
            maxDate={new Date()}
            minDate={new Date(最小时间)}
            //maxDate={new Date(2026, 11, 3)}当然是最大
            onChange={this.changeDate}
            format="YYYY-MM-DD"
          >
            <List.Item arrow="horizontal">
              <Text style={{ fontSize: 17, color: "#000000" }}>日期</Text>
            </List.Item>
      </DatePicker>

4.该组件有坑，演示案例较少，（12月28日官网更新后新增了样式预览，和演示案例）

官网上有web版本支持预览，实际效果和rn相差不大，可以参考，这个组件支持嵌套，不可以改动的文字往往可以嵌套 来解决。优点是样式齐全，缺点案例文档较少