You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
121 lines
2.1 KiB
121 lines
2.1 KiB
# vue-upload-component
|
|
|
|
> Vue.js file upload component, Support for multiple file uploads, progress, html4, ie9
|
|
**Html4 does not support the progress bar, file size, accept, timeout, headers, response status code error of judgment**
|
|
|
|
|
|
|
|
## Install
|
|
|
|
``` bash
|
|
npm install vue-upload-component --save
|
|
```
|
|
### CommonJS
|
|
```js
|
|
var FileUpload = require('vue-upload-component');
|
|
|
|
new Vue({
|
|
template: '<file-upload action="/"></file-upload>',
|
|
components: {
|
|
FileUpload: FileUpload
|
|
}
|
|
})
|
|
|
|
```
|
|
|
|
### ES6
|
|
```js
|
|
import FileUpload from 'vue-upload-component'
|
|
new Vue({
|
|
template: '<file-upload action="/"></file-upload>',
|
|
components: {
|
|
FileUpload
|
|
}
|
|
})
|
|
|
|
```
|
|
|
|
|
|
## Example
|
|
``` html
|
|
<!-- Example file ./index.html -->
|
|
<!-- Example file ./src/example.js -->
|
|
<div id="app">
|
|
<file-upload title="Add upload files"></file-upload>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
var FileUpload = require('vue-upload-component');
|
|
|
|
new Vue({
|
|
el:'#app',
|
|
components: {
|
|
FileUpload:FileUpload,
|
|
},
|
|
});
|
|
</script>
|
|
```
|
|
|
|
## Build Setup
|
|
|
|
``` bash
|
|
# install dependencies
|
|
npm install
|
|
|
|
# serve with hot reload at localhost:8080
|
|
npm run dev
|
|
|
|
# build for production with minification
|
|
npm run build
|
|
```
|
|
|
|
|
|
## Dispatch
|
|
addFileUpload
|
|
|
|
removeFileUpload
|
|
|
|
fileUploadProgress
|
|
|
|
beforeFileUpload
|
|
|
|
afterFileUpload
|
|
|
|
|
|
|
|
|
|
## Setting
|
|
|
|
### Data
|
|
``` json
|
|
{
|
|
files: [{
|
|
//
|
|
request: {
|
|
headers: {
|
|
"X-Csrf-Token": "xxxx",
|
|
},
|
|
data: {
|
|
"_csrf_token": "xxxxxx",
|
|
},
|
|
},
|
|
}],
|
|
|
|
// Global
|
|
request: {
|
|
headers: {
|
|
"X-Csrf-Token": "xxxx",
|
|
},
|
|
data: {
|
|
"_csrf_token": "xxxxxx",
|
|
},
|
|
},
|
|
}
|
|
```
|
|
|
|
|
|
### Props
|
|
``` html
|
|
<file-upload :title="Add upload files" :name="file" :action="./upload.php" :accept="accept" :multiple="multiple" :size="size" :timeout="3600000"></file-upload>
|
|
```
|