修改日期更新无效问题

src/views/super/Ranking/Purchase.vue

@@ -31,10 +31,8 @@
                             </div>
                         </el-form-item>
                         <el-form-item label="起止日期" prop="date" label-width="73px">
-                            <el-date-picker v-model="form.date" type="daterange" range-separator="至"
-                                start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyy-MM-dd"
-                                style="width: 100%;">
-                            </el-date-picker>
+                            <el-date-picker v-model="form.date" type="daterange" value-format="yyyy-MM-dd" range-separator="至"
+                             start-placeholder="开始时间" end-placeholder="结束时间" @input="testClick" style="width: 100%;"></el-date-picker>
                         </el-form-item>
                     </template>
                 </el-form>
@@ -163,7 +161,7 @@ export default {
                 unit_price: '',
                 unit_num: '',
                 cost: '',
-                date: '',
+                date: [],
                 start_date: '',
                 end_date: '',
             },
@@ -199,17 +197,24 @@ export default {
             this.currentPage = 1
             this.getData()
         },
-        'form.date'(newVal) {
-            if (Array.isArray(newVal) && newVal.length === 2) {
-                this.form.start_date = this.formatDateTime(new Date(newVal[0]));
-                this.form.end_date = this.formatDateTime(new Date(newVal[1]));
-            } else {
-                this.form.start_date = '';
-                this.form.end_date = '';
-            }
-        }
+        // 'form.date'(newVal) {
+        //     if (Array.isArray(newVal) && newVal.length === 2) {
+        //         this.form.start_date = this.formatDateTime(new Date(newVal[0]));
+        //         this.form.end_date = this.formatDateTime(new Date(newVal[1]));
+        //     } else {
+        //         this.form.start_date = '';
+        //         this.form.end_date = '';
+        //     }
+        // }
     },
     methods: {
+        testClick(e) {
+            this.$nextTick(() => {
+                // this.$set(this.form, "date", [e[0], e[1]]);
+                this.$set(this.form, "start_date", e[0]);
+                this.$set(this.form, "end_date",  e[1]);
+            });
+        },
         getData(){
             if (this.type == 'purchase') {
                 this.getPurchase()
@@ -379,7 +384,7 @@ export default {
             this.dialogVisible = true;
             this.$nextTick(()=>{
                 this.form = { ...row };
-                this.form.date = [row.start_date, row.end_date]
+                this.$set(this.form,'date', [row.start_date, row.end_date])
                 this.$forceUpdate();
             })
         },