🏠 Homepage

Install

yarn add react-swui

# or

npm i react-swui

Usage

import React from 'react';
import { Button } from 'react-sw';
import 'react-swui/dist/index.css';

export default () => {
  return (
    <>
      <Button text='成功按钮' btnType='success' />
      <Button text='主要按钮' btnType='primary' />
      <Button text='信息按钮' btnType='info' />
      <Button text='默认按钮' />
      <Button text='危险按钮' btnType='danger' />
      <Button text='警告按钮' btnType='warning' />
    </>
  );
};

🥥 All Use Cases

React Mobile Component

Current projects include component encapsulation for everyday use

目录结构

components
├── BackTop                   # 返回顶部
├── Badge                     # 徽标 在右上角展示徽标数字或小红点。
├── Button                    # 按钮
├── Icon                      # 样式图标
├── Image                     # 图片组件
├── Loading                   # 加载组件
├── LoadMore                  # 加载完成 ｜ 加载中
├── Overlay                   # 遮罩层
├── Popup                     # 上下左右弹出 支持拖拽 关闭
├── Switch                    # 开关
├── TextAlign                 # 文字对齐
├── Checkbox                  # 复选框 用于在选中和非选中状态之间进行切换。
├── Cascader                  # 数据选择 三级选择 支持 数据格式化 支持 异步请求
├── Cell                      # 单元格为列表中的单个展示项。
├── ActionSheet               # 底部弹起的模态面板，包含与当前情境相关的多个选项。
├── ..............

directory structure

The following is an introduction to the catalog structure of the whole project。
components                    # Packaged components
├── BackTop                   # Back to the top
├── Badge                     # The logo shows the logo number or small red dot in the upper right corner
├── Button                    # Button
├── Icon                      # Icon
├── Image                     # Image
├── Loading                   # Loading
├── LoadMore                  # LoadMore ｜ LoadMore ing
├── Overlay                   # Overlay
├── Popup                     # Popup
├── Switch                    # Switch
├── Cascader                  # Cascader
├── TextAlign                 # TextAlign
├── Checkbox                  # Checkbox。
├── Cascader                  # Cascader
├── Cell                      # Cell
├── ActionSheet               # ActionSheet
├── ..............