bee-loading-state 组件常用于在按钮上加载状态
$ git clone https://github.com/tinper-bee/bee-loading-state
$ cd bee-loading-state
$ npm install
$ npm run dev
loading-state依赖于button,使用loading-state还需把button组件down下来
$ npm install bee-loading-state
$ npm run dev
先进行下载loading-state包
npm install --save bee-loading-state
组件调用
import LoadingState from 'bee-loading-state';
React.render(<div>
<div>
<LoadingState loadingTime="4000" loadingText="loading...">Confirm</LoadingState>
</div>
</div>, document.getElementById('target'));
- 使用link引入build目录下LoadingState.css
<link rel="stylesheet" href="./node_modules/build/LoadingState.css">
- 同理,在js中import样式也是LoadingState的样式
import "bee-loading-state/build/LoadingState.css"
(tinper-bee组件库使用方法)[]
button的参数在loading-state同样适用,可以使用其他Button组件的props,来设置LoadingState组件中按钮的props。 loading-state扩展的参数如下。
参数 | 说明 | 类型 | 默认值 |
---|---|---|---|
className | 类名 | string | - |
loadingText | 自定义loading时显示文字内容 | string | loading |
show | 是否显示loading | boolean | false |
showBackDrop | 是否显示loading时给button显示遮罩层 | boolean | true |