[2.7.6] Pass fileList prop as file-list prop to <Upload />

Author: isnifer

CHANGELOG.md

@@ -1,3 +1,28 @@
+## 2.7.6
+
+### Fixed
+
+— Pass `fileList` prop as `file-list` prop to `<Upload />`
+— Can't use value for now as `file-list` prop
+
+```js
+// Correct example
+<Upload
+  formItem
+  showFileList
+  name="specificationFiles"
+  label="Upload Specification*"
+  labelWidth="150px"
+  endpoint="uploadSpecification"
+  // These initial values you have passed to form
+  // Default value is an empty array
+  fileList={this.initialValues.specificationFiles}
+  httpRequest={this.createUploadFile}
+  formatResponse={this.formatResponse}>
+  <Button>Browse</Button>
+</Upload>
+```
+
 ## 2.7.5
 
 ### Fixed

README.md

@@ -80,6 +80,7 @@ See demo at [https://detools.github.io/vue-form](https://detools.github.io/vue-f
 
 ## Changelog
 
+- [2.7.6](/CHANGELOG.md#276)
 - [2.7.5](/CHANGELOG.md#275)
 - [2.7.4](/CHANGELOG.md#274)
 - [2.7.3](/CHANGELOG.md#273)

VueForm/components/ConnectedUpload.js

@@ -1,5 +1,6 @@
 import { Upload } from 'element-ui'
 import noop from 'lodash/noop'
+import castArray from 'lodash/castArray'
 import ConnectedControlMixin from '../mixins/ConnectedControl'
 
 const defaultHandler = {
@@ -82,10 +83,10 @@ const ConnectedInput = {
       default: response => response,
     },
 
-    // fileList: {
-    //   type: Array,
-    //   default: () => [],
-    // },
+    fileList: {
+      type: Array,
+      default: () => [],
+    },
 
     listType: {
       type: String,
@@ -158,10 +159,15 @@ const ConnectedInput = {
       this.handleSuccess(response, file, filelist)
 
       const [, setValue] = this.state
-      setValue(this.formatResponse(response, file, filelist))
+      const transformedResponse = this.formatResponse(response, file, filelist)
+      const nextValue = castArray(filelist)
+        .slice(0, -1)
+        .concat(transformedResponse)
+
+      setValue(nextValue)
     },
 
-    renderComponent(value) {
+    renderComponent() {
       return (
         <Upload
           {...this.callbacks}
@@ -177,7 +183,7 @@ const ConnectedInput = {
           accept={this.accept}
           before-upload={this.beforeUpload}
           before-remove={this.beforeRemove}
-          file-list={value}
+          file-list={this.fileList}
           list-type={this.listType}
           auto-upload={this.autoUpload}
           http-request={this.httpRequest}

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@detools/vue-form",
-  "version": "2.7.5",
+  "version": "2.7.6",
   "description": "Form State Management for VueJS",
   "main": "VueForm/index.js",
   "scripts": {