From c40ffd28ebd6931c8d40abb826583cc683637af9 Mon Sep 17 00:00:00 2001
From: liyang <1711467488@qq.com>
Date: Wed, 28 Nov 2018 19:43:04 +0800
Subject: [PATCH] =?UTF-8?q?=E6=97=A0=E7=BC=93=E5=AD=98=E7=BC=96=E8=BE=91?=
 =?UTF-8?q?=E6=96=B9=E6=A1=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Former-commit-id: 6883d69fa575d23f2b84d87c98837513ce80796d [formerly d5db79752e5291211213ee25de648bef17890514] [formerly 6883d69fa575d23f2b84d87c98837513ce80796d [formerly d5db79752e5291211213ee25de648bef17890514] [formerly 6883d69fa575d23f2b84d87c98837513ce80796d [formerly d5db79752e5291211213ee25de648bef17890514] [formerly d5db79752e5291211213ee25de648bef17890514 [formerly 4e406142b9bb6080e9e1762c0a4bef23a1e50cd6 [formerly 1bf019d5133f11592485fa0f7cb1de7efec5b445]]]]]
Former-commit-id: d51db872aaf542f2b43a961e33072c072776506c
Former-commit-id: c5894cf9c1ee7748390cb62af232866c51c3c134
Former-commit-id: 65920a88a0ad59b76a722014c50fa26c2e72335d [formerly 69b2ad233bdca2af18a802eb70d8fc8f4f9b8c18]
Former-commit-id: a1bf30ad771fa9ebfd93f0d0176db83b8cbc761a
Former-commit-id: 01b20064c86040c27526f032537f393e4d45616e
Former-commit-id: 0c7c844d38c24679b82ed3b9c5eee402a835dd8e
Former-commit-id: 5221a9aa5913d25224c3a9060881124e90cc3876
Former-commit-id: 3712bbcc1f0c6bb7cb660871b9e14797146e596c
---
 src/pages/demo/business/issues/142/edit.vue  | 67 +++++++++++++-------
 src/pages/demo/business/issues/142/index.vue |  4 +-
 src/router/modules/business.js               |  2 +-
 3 files changed, 47 insertions(+), 26 deletions(-)

diff --git a/src/pages/demo/business/issues/142/edit.vue b/src/pages/demo/business/issues/142/edit.vue
index 79fe15c0..ca9ccdb4 100644
--- a/src/pages/demo/business/issues/142/edit.vue
+++ b/src/pages/demo/business/issues/142/edit.vue
@@ -3,7 +3,11 @@
     type="card"
     class="demo-business-issues-142-edit">
     <template slot="header">编辑 id: {{id}}</template>
-    <el-form ref="form" :model="form" label-width="80px" class="demo-business-issues-142-edit--form">
+    <el-form
+      ref="form"
+      :model="form"
+      label-width="80px"
+      class="demo-business-issues-142-edit--form">
       <el-form-item label="姓名">
         <el-input v-model="form.name"/>
       </el-form-item>
@@ -12,14 +16,12 @@
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="handleSubmit">修改</el-button>
-        <el-button @click="handleCancel">取消</el-button>
       </el-form-item>
     </el-form>
   </d2-container>
 </template>
 
 <script>
-import { mapActions } from 'vuex'
 import { get } from '@/api/demo/business/issues/142'
 export default {
   props: {
@@ -36,34 +38,55 @@ export default {
       }
     }
   },
-  created () {
-    // 自动加载一次表单数据
-    this.getFormData()
+  // 第一次进入或从其他组件对应路由进入时触发
+  beforeRouteEnter (to, from, next) {
+    const id = to.params.id
+    if (id) {
+      next(vm => {
+        vm.resetFormData()
+        vm.getFormData(id)
+      })
+    }
+    else {
+      next(new Error('未指定ID'))
+    }
+  },
+  // 在同一组件对应的多个路由间切换时触发
+  beforeRouteUpdate (to, from, next) {
+    const id = to.params.id
+    if (id) {
+      this.resetFormData()
+      this.getFormData(id)
+      next()
+    } else {
+      next(new Error('未指定ID'))
+    }
   },
   methods: {
-    ...mapActions('d2admin/page', [
-      'close'
-    ]),
-    // 根据 id 获取数据
-    getFormData () {
-      get(this.id)
+    // [业务逻辑] 重置表单
+    resetFormData () {
+      this.form = {
+        name: '',
+        address: ''
+      }
+    },
+    // [业务逻辑] 根据 id 获取数据
+    getFormData (id) {
+      get(id)
         .then(res => {
-          this.form.name = res.name
-          this.form.address = res.address
+          const { name, address } = res
+          this.form = { name, address }
         })
         .catch(err => {
           console.log('err', err)
         })
     },
-    // 提交
+    // [业务逻辑] 提交
     handleSubmit () {
-      console.log('submit!')
-    },
-    // 取消编辑
-    handleCancel () {
-      this.close({
-        tagName: this.$route.fullPath,
-        vm: this
+      this.$notify({
+        title: 'Submit',
+        message: '提交了表单',
+        type: 'success'
       })
     }
   }
diff --git a/src/pages/demo/business/issues/142/index.vue b/src/pages/demo/business/issues/142/index.vue
index a1df4a94..ceb280e6 100644
--- a/src/pages/demo/business/issues/142/index.vue
+++ b/src/pages/demo/business/issues/142/index.vue
@@ -32,12 +32,10 @@ export default {
           size: 'mini'
         },
         rowHandle: {
-          width: 80,
           align: 'center',
           custom: [
             {
-              text: '编辑',
-              type: 'primary',
+              text: '无缓存编辑',
               size: 'mini',
               emit: 'edit'
             }
diff --git a/src/router/modules/business.js b/src/router/modules/business.js
index 3454c547..7ba893a8 100644
--- a/src/router/modules/business.js
+++ b/src/router/modules/business.js
@@ -43,7 +43,7 @@ export default {
       props: true,
       meta: {
         ...meta,
-        title: 'issue #142 Edit'
+        title: '无缓存编辑'
       }
     }
   ])('demo-business-')