nuke-biz-custom-loading

CustomLoading

• category: UI
• chinese: 加载中
• type: UI组件

---

何时使用

需要定制 toast 的文案、Icon 时

API

参数	说明	类型	默认值
image	图片，gif 版本	{{uri:''},style:{}}	无
onHide	关闭时触发回调	function
onShow	打开后后触发回调	function	false
style	mask 样式	object	{}
animate	是否开启渐显渐隐动画	boolean	true

demo

 
/** @jsx createElement */
import {createElement, Component,render } from 'rax';
import {View,Text,Page,Button} from 'weex-nuke';
import CustomLoading from 'nuke-biz-custom-loading';
 
let App = class NukeDemoIndex extends Component {
  constructor() {
    super();
    this.closeHandler = this.closeHandler.bind(this);
    this.showLoading = this.showLoading .bind(this);
  }
  showLoading(){
    this.loading.wrappedInstance.show();
    setTimeout(()=>{
      this.loading.wrappedInstance.hide();
    },2000);
  }
  closeHandler(){
    console.log('toast closed');
  }
  render() {
    return (
      <Page title="custom-loading">
          <Page.Intro main="basic" sub="basic-sub"/>
          <Button onPress={this.showLoading} type="primary">点我</Button>
          <CustomLoading
            ref={(n)=>{this.loading = n;}}
            image={{
              uri:
                '//img.alicdn.com/tfs/TB1uC0kgLDH8KJjy1XcXXcpdXXa-256-256.gif',
              style: {
                width: 90,
                height: 90,
              },
            }}
            style={{backgroundColor:'transparent'}}
            onHide={this.closeHandler}
          />
      </Page>
    );
  }
}
 
render(<App/>);
```