Skip to content

sishuguojixuefu/antd-mobile-rn

Repository files navigation

Ant Design Mobile RN

Ant Design 移动端设计规范。@sishuguojixuefu/antd-mobile-rn 是 Ant Design 的移动规范的 React 实现,服务于蚂蚁及口碑无线业务。

通知

新版本3.x已经重构完成并发布,安装升级请查看 更新日志

特性

  • 基于 Ant Design 移动设计规范。
  • 规则化的视觉样式配置,适应各类产品风格。
  • 基于 React Native 的多平台支持。
  • 使用 TypeScript 开发,提供类型定义文件。

演示

请先安装 expo app: https://expo.io/tools

安装 & 使用

npm install @sishuguojixuefu/antd-mobile-rn --save

or

yarn add @sishuguojixuefu/antd-mobile-rn

链接字体图标

react-native link @ant-design/icons-react-native

按需加载

$ yarn add babel-plugin-import -D

babel.config.js:

plugins: [
  ['import', { libraryName: '@sishuguojixuefu/antd-mobile-rn' }],
],

使用 Modal、Toast

如果需要使用 Modal 以及 Toast 还需要在 App 的入口处加上 Provider:

import React, { Component } from 'react';
import { Button, Provider, Toast } from '@sishuguojixuefu/antd-mobile-rn';

export default class HelloWorldApp extends Component {
  render() {
    return (
      <Provider>
        <Button onPress={() => Toast.info('This is a toast tips')}>
          Start
        </Button>
      </Provider>
    );
  }
}

介绍

链接

欢迎贡献

有任何建议或意见您可以进行 提问