@aliretail/react-materials-components/demo/OssUploader/example.md

B 端物料组件库

---
title: OssUploader-Simple
order: 1
---

```jsx
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { OssUploader } from '@aliretail/react-materials-components';


import './index.scss';

class App extends Component {
  state = {
    value: ['//cz-item.oss-cn-hangzhou.aliyuncs.com/tny/crm/banner/20210125/d2986de26e648fd19cb00ba710a86266.png', '//cz-item.oss-cn-hangzhou.aliyuncs.com/tny/crm/banner/20210125/d2986de26e648fd19cb00ba710a86266.png'],
  };

  onChange = (value) => {
    console.log('value changed', value);
    this.setState({
      value,
    });
  };

  render() {
    return (
      <div>
        <h1>uploadType='image'</h1>
        <OssUploader
          limit={3}
          value={this.state.value}
          onChange={this.onChange}
          getOssSignatureUrl="//tny.dev.retailcloud.zacz.cn/file/dubbo/getOssSignature"
          uploadCallbackUrl="//tny.dev.retailcloud.zacz.cn/file/dubbo/uploadCallback"
          bizType="articleMaterial"
          uploadScene="crm"
          uploadType="image"
        />
        <h1>uploadType="all"</h1>
        <OssUploader
          limit={3}
          value={this.state.value}
          onChange={this.onChange}
          getOssSignatureUrl="//tny.dev.retailcloud.zacz.cn/file/dubbo/getOssSignature"
          uploadCallbackUrl="//tny.dev.retailcloud.zacz.cn/file/dubbo/uploadCallback"
          bizType="articleMaterial"
          uploadScene="crm"
          uploadType="all"
        />
      </div>
    );
  }
}

ReactDOM.render(<App />, mountNode);
```