rc-loading

rc-loading 是一个基于React封装的loading组件;该组件写法模仿ant-design中Spin,是其扩展组件

本组件 动效 也依赖于 antd 的 rc-animate

目前组件支持三种不同的loading样式 详情请见 CSS实现多种loading

更新

版本1.0.0 更新时间: 2018-01-14

安装

 npm install rc-loading --save

用法

name	type	default	description
spinning	Boolean	true	是否显示spinning
type	String	'fence'	loading的样式 其他可选值为 'ellipsis','dynamicEllipsis'
displayType	String	'block'	内联元素和块元素 其他可选值为 'inlineBlock'

example

import React, { Component } from 'react';
import Loading from 'rc-loading';

class App extends Component {
  constructor(props){
    super(props)
    this.state={
      spinning:false
    }
  }


  render() {
    return (
     <div>
        <Loading spinning={this.state.spinning} displayType={"inlineBlock"}>
          <span>hello loading</span>
       </Loading>
       <span onClick={()=>{
         this.setState({
           spinning:!this.state.spinning,
         })
       }}>点击</span>
     </div>
    );
  }
}

export default App;

效果