简介
proteus-js-frames 是一个基于 React 的前端组件库，提供了各种常见的 UI 组件，如按钮、弹窗、表格、图表等。它使用了最新的 ES6、ES7 语法，应用 webpack 进行自动化构建。
安装
我们可以使用 npm、yarn 或者 cnpm 安装 proteus-js-frames：
npm install proteus-js-frames --save
yarn add proteus-js-frames
cnpm install proteus-js-frames --save
使用
使用 proteus-js-frames 很简单，只需要在代码中引入所需的组件即可。
-- -------------------- ---- -------
------ ----- ---- --------
------ - ------- ----- - ---- --------------------
------ ------- ----- --- ------- --------------- -
-------- -
------ -
-----
------------- -----------
------ ----------- ------ ---------------
---- -- - ---- -----
--------
------
--
-
-组件列表
proteus-js-frames 提供了以下常用组件：
- Button 按钮
- Modal 弹窗
- Table 表格
- Chart 图表
- Form 表单
- …
高级用法
proteus-js-frames 还提供了一些高级用法，可以满足更多的开发需求。
自定义主题
如果默认的样式不符合你的要求，你可以通过覆盖 less 变量来自定义主题样式。
@primary-color: #1890ff; // 其他 less 变量... @import '~proteus-js-frames/dist/theme.less';
按需加载
如果你只需要使用组件库中的部分组件，可以通过使用 babel-plugin-import 插件来实现按需加载，避免将整个组件库都打入到你的项目中。
-- -------------------- ---- -------
----------
-
---------- -
---------- -
-------------- --------------------
------------------- ------------------
-------- ----
--
-
-这样，你在引入组件时只需要写上组件的名字即可。
import { Button, Modal } from 'proteus-js-frames';TypeScript 支持
proteus-js-frames 支持 TypeScript，你可以轻松地将其集成到你的 TypeScript 项目中。
-- -------------------- ---- -------
------ ----- ---- --------
------ - ------- ----- - ---- --------------------
------ - ----------- - ---- -------------------------------------------
----- --- ------- --------------- -
----------- - --- ------------------------------ -- -
---------------
-
-------- -
------ -
-----
------- -------------------------------- -----------
------ ----------- ------ ---------------
---- -- - ---- -----
--------
------
--
-
-结语
proteus-js-frames 是一个功能强大、易用性高的前端组件库，具有很好的扩展性和兼容性，可以极大地提高开发效率。希望本文对您有所帮助，感谢阅读！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60067355890c4f7277583b5b