React Ocean 组件库

文章目录 交互展示 使用方法 实现需求 发布订阅实现思路 关闭，更新弹框实现思路 动画实现思路 组件库地址：https://github.com/Ryan-eng-del/Ocean - 交互展示 使

交互展示 使用 需求 DropMenu 基本使用 受控菜单 自定义菜单 自定义图标 beforeIcon, afterIcon Hover 模式 支持子菜单 实现

交互展示 使用 需求 switch 基本使用 支持不同类别 自定义 toggle 图标 自定义受控 Switch 内容 受控 Switch 自定义内容 实现

交互展示 使用 需求 message 基本使用 自定义宽度 自定义不同方向的动画 最大 message 个数 自定义持续时间 不同 message 类别 实现

交互展示 使用 需求 支持基本弹框 支持异步调用 支持函数式调用 支持函数式 + 异步调用 支持自定义页脚位置 自定义宽度 自定义页脚组件 自定义页脚文字 实现

交互展示 使用 需求 支持自定义字体大小 支持背景，及 hover 效果 每组的最后一个导航，保持 hover 效果 支持下划线导航 支持图标导航 支持自定义分隔符导航 实现

交互展示 使用 需求 支持不同大小 支持不同对齐方向 支持无文字自定义 padding 支持字体大小 支持不同尺寸 实现

使用 需求 支持不同方向的抽屉 支持异步抽屉 支持全屏抽屉 支持自定义尺寸抽屉 支持自定义页脚抽屉 实现

交互展示 使用 需求 支持不同方向，不同大小，不同类型的多选按钮。 实心样式多选题按钮。 实现 思路：CheckBox 主要是复用了 Radio 组件。

交互展示 使用 需求 支持不同方向，不同大小，不同类型的单选按钮。 实心单选题按钮。 实现 思路：Radio 主要是复用了 ButtonBase 的 type, 以及 ButtonBase 的 波浪动

普通模式 手风琴模式 第一：菜单基本使用 菜单的基本 HTML 结构实现 菜单的展开和收缩基本思路 通过使用 ref，获取到对应收缩子容器的节点。 实现树的展开和收缩 第一：收缩的时候，高度变为 0

树形控件，交互展示 添加节点 编辑节点 删除节点 灵感来自 树的结构灵感来自：Material UI源码。 地址：https://github.com/mui/material-ui/tree/mas

笔者在校做一个学习系统，Antd v4 在学习系统当中的表现，不足以支撑起学习系统对样式的定制化。所以有了 React Ocean， React Ocean 是一个为学习系统开发的组件