[2.7.5] Pass <Upload /> value as file-list prop to UI component

Author: isnifer

CHANGELOG.md

@@ -1,3 +1,11 @@
+## 2.7.5
+
+### Fixed
+
+— Pass `<Upload />` value as `file-list` prop to UI component
+— Add default noop value for `handleModelChange`
+— Call `handleModelChange` on `reinitialize`
+
 ## 2.7.4
 
 ### Added

README.md

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

VueForm/components/ConnectedUpload.js

@@ -82,10 +82,11 @@ const ConnectedInput = {
       default: response => response,
     },
 
-    fileList: {
-      type: Array,
-      default: () => [],
-    },
+    // fileList: {
+    //   type: Array,
+    //   default: () => [],
+    // },
+
     listType: {
       type: String,
       default: 'text',
@@ -160,7 +161,7 @@ const ConnectedInput = {
       setValue(this.formatResponse(response, file, filelist))
     },
 
-    renderComponent() {
+    renderComponent(value) {
       return (
         <Upload
           {...this.callbacks}
@@ -176,7 +177,7 @@ const ConnectedInput = {
           accept={this.accept}
           before-upload={this.beforeUpload}
           before-remove={this.beforeRemove}
-          file-list={this.fileList}
+          file-list={value}
           list-type={this.listType}
           auto-upload={this.autoUpload}
           http-request={this.httpRequest}

VueForm/components/Form/Form.js

@@ -136,9 +136,7 @@ export default {
           vm.$delete(this.asyncErrors, name)
         }
 
-        if (this.handleModelChange) {
-          this.handleModelChange(this.state)
-        }
+        this.handleModelChange(this.state)
 
         setError(nextValue)
       }
@@ -288,6 +286,8 @@ export default {
       this.syncErrors = {}
       this.asyncErrors = {}
       this.touchedFields = {}
+
+      this.handleModelChange(this.state)
     },
 
     renderPlainButtons() {

VueForm/components/Form/props.js

@@ -33,7 +33,10 @@ const formProps = {
     type: Function,
     default: noop,
   },
-  handleModelChange: Function,
+  handleModelChange: {
+    type: Function,
+    default: noop,
+  },
   handleDisabled: {
     type: Function,
     default: noop,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@detools/vue-form",
-  "version": "2.7.4",
+  "version": "2.7.5",
   "description": "Form State Management for VueJS",
   "main": "VueForm/index.js",
   "scripts": {
@@ -15,14 +15,7 @@
     "type": "git",
     "url": "git+https://github.com/detools/vue-form.git"
   },
-  "keywords": [
-    "vue",
-    "form",
-    "state",
-    "management",
-    "validation",
-    "errors"
-  ],
+  "keywords": ["vue", "form", "state", "management", "validation", "errors"],
   "author": "Anton Kuznetsov <isnifer@gmail.com> (https://github.com/isnifer)",
   "license": "MIT",
   "bugs": {