@aliretail/react-materials-components
Version:
98 lines (89 loc) • 2.77 kB
Markdown
---
title: Button-Usage
order: 1
---
isPreview & readOnly 暂时展现形式相同
```jsx
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { OssUploader } from '@aliretail/react-materials-components';
class App extends Component {
render() {
return (
<div>
<h4>hidden</h4>
<OssUploader
value='//img.alicdn.com/tps/TB19O79MVXXXXcZXVXXXXXXXXXX-1024-1024.jpg'
hidden
/>
<h1>uploadType: image</h1>
<h4>isPreview</h4>
<OssUploader
value='https://img.alicdn.com/imgextra/i3/O1CN01AKswH11IZRteGQ6Jq_!!6000000000907-2-tps-754-1778.png'
isPreview
/>
<h4>isPreview - 没有value值时<small>isPreview with empty</small></h4>
<OssUploader
isPreview
/>
<h4>isPreview - 有value值时<small>isPreview with value</small></h4>
<OssUploader
value='//img.alicdn.com/tps/TB19O79MVXXXXcZXVXXXXXXXXXX-1024-1024.jpg'
isPreview
/>
<h4>readOnly</h4>
<OssUploader
value='//img.alicdn.com/tps/TB19O79MVXXXXcZXVXXXXXXXXXX-1024-1024.jpg'
readOnly
/>
<h4>disabled - 有value值时<small>disabled with value</small></h4>
<OssUploader
value={["///img.alicdn.com/tps/TB19O79MVXXXXcZXVXXXXXXXXXX-1024-1024.jpg"]}
limit={2}
disabled
/>
<h4>disabled - 无value值时<small>disabled with empty</small></h4>
<OssUploader
limit={2}
disabled
/>
<h1>uploadType: video</h1>
<h4>isPreview - 没有value值时<small>isPreview with empty</small></h4>
<OssUploader
isPreview
uploadType="video"
/>
<h4>isPreview - 有value值时<small>isPreview with value</small></h4>
<OssUploader
isPreview
uploadType="video"
value="https://image-dev2.zacz.cn/tny/item/itemVideo/20210524/86b75bf947d9f12cb297837aaea51014.mp4"
/>
<h1>uploadType: all</h1>
<h4>disabled</h4>
<OssUploader
uploadType='all'
limit={2}
disabled
/>
<h4>isPreview - 没有value值时<small>isPreview with empty</small></h4>
<OssUploader
uploadType='all'
limit={2}
isPreview
/>
<h4>isPreview - 有value值时<small>isPreview with value</small></h4>
<OssUploader
value={["//cz-item.oss-cn-hangzhou.aliyuncs.com/fh01/crm/articleMaterial/20201211/75b2af803d1e3f7ee932d6803ab1ed90.xlsx"]}
uploadType='all'
limit={2}
isPreview
/>
</div>
);
}
}
ReactDOM.render((
<App />
), mountNode);
```