Shinemo-uploader NPM

上传组件/Uploader

依赖

jquery

使用

参数	类型	备注
url	String	必填上传文件的服务端地址
id	String	Uploader的唯一标示id，用来区分同时有多个Uploader的情况
autoUpload	Bool	是否选完文件后自动上传
contentType	String	上传文件的form表单数据格式，默认`multipart/form-data`'
fileName	String	文件名，默认`file`
crossDomain	Bool	是否跨域
maxSize	Number	上传文件的最大大小，单位`K`
minSize	Number	上传文件的最小大小，单位`K`
extension	String	`只支持上传图片时`图片后缀，多个后缀以`,`分隔
width	Number	`只支持上传图片时`图片宽度,单位`px`
height	Number	`只支持上传图片时`图片高度,单位`px`
disabled	Bool	设置上传组件不可点
beforeUpload	Function	开始上传之前的回调
beforeDestroy	Function	销毁组件之前的回调
onValidated	Function	验证通过回调
onProgress	Function	进度回调 `仅当浏览器支持时才触发`
onSelected	Function	选完文件后的回调
onInvalid	Function	验证不通过
onSuccess	Function	上传成功
onError	Function	上传失败
multi	Bool/Object	支持多选，`目前服务端不支持，设置后无法上传`

// jquery.vendor.js
import $ from 'jquery'
window.$ = $

export default $

// 依赖jquery的$所以需要自己先封装下jquery
import 'jquery.vendor';
import React from 'react'
import ReactDOM from 'react-dom'
import Uploader from '@xm/Uploader'

function onSuccess (data) {
  console.log(data)
}

window.addEventListener('DOMContentLoaded', () => {
  ReactDOM.render((
    <Uploader onSuccess={onSuccess} crossDomain={true}
              url='https://web.jituancaiyun.com/sfs/webUpload/file?uid=10101001191214848&ts=1505094762217137&token=f3ee81fc20c2d3170b02a81ac9c4f8e2'
              maxSize={10000}>
    <div>点击上传</div>
  </Uploader>), document.body)
})

classnames console-polyfill es3ify-webpack-plugin es5-shim export-from-ie8 jquery normalize.css react react-dom

shinemo-web-comment

0.3.3

3 years ago