diff --git a/package.json b/package.json
index f610ced7..0f6fdb5f 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,7 @@
     "test:unit": "vue-cli-service test:unit"
   },
   "dependencies": {
-    "@d2-projects/d2-crud": "^2.0.0",
+    "@d2-projects/d2-crud": "^2.0.2",
     "@d2-projects/vue-filters-date": "^1.0.2",
     "@d2-projects/vue-table-export": "^1.0.1",
     "@d2-projects/vue-table-import": "^1.0.0",
diff --git a/src/pages/demo/d2-crud/demo17/index.vue b/src/pages/demo/d2-crud/demo17/index.vue
index 66fb32a8..6bd6c9b5 100644
--- a/src/pages/demo/d2-crud/demo17/index.vue
+++ b/src/pages/demo/d2-crud/demo17/index.vue
@@ -136,7 +136,7 @@ export default {
   methods: {
     editRowWithNewTemplate () {
       this.$refs.d2Crud.showDialog({
-        mode: "edit",
+        mode: 'edit',
         rowIndex: 2,
         template: {
           date: {
diff --git a/src/pages/demo/d2-crud/demo22/code.js b/src/pages/demo/d2-crud/demo22/code.js
index 30eb26de..e0590166 100644
--- a/src/pages/demo/d2-crud/demo22/code.js
+++ b/src/pages/demo/d2-crud/demo22/code.js
@@ -1,15 +1,16 @@
 export default `<template>
   <div>
     <d2-crud
+      ref="d2Crud"
       :columns="columns"
       :data="data"
-      add-mode
-      :add-button="addButton"
-      :form-template="formTemplate"
+      :add-template="addTemplate"
       :form-options="formOptions"
-      :form-rules="formRules"
+      :add-rules="addRules"
       @row-add="handleRowAdd"
-      @dialog-cancel="handleDialogCancel"/>
+      @dialog-cancel="handleDialogCancel">
+      <el-button slot="header" style="margin-bottom: 5px" @click="addRow">新增</el-button>
+    </d2-crud>
   </div>
 </template>
 
@@ -58,7 +59,7 @@ export default {
         icon: 'el-icon-plus',
         size: 'small'
       },
-      formTemplate: {
+      addTemplate: {
         date: {
           title: '日期',
           value: ''
@@ -77,7 +78,7 @@ export default {
         labelPosition: 'left',
         saveLoading: false
       },
-      formRules: {
+      addRules: {
         date: [ { required: true, message: '请输入日期', trigger: 'blur' } ],
         name: [ { required: true, message: '请输入姓名', trigger: 'blur' } ],
         address: [ { required: true, message: '请输入地址', trigger: 'blur' } ]
@@ -85,6 +86,11 @@ export default {
     }
   },
   methods: {
+    addRow () {
+      this.$refs.d2Crud.showDialog({
+        mode: 'add'
+      })
+    },
     handleRowAdd (row, done) {
       this.formOptions.saveLoading = true
       setTimeout(() => {
diff --git a/src/pages/demo/d2-crud/demo22/doc.md b/src/pages/demo/d2-crud/demo22/doc.md
index 71ac15a8..6324ce0d 100644
--- a/src/pages/demo/d2-crud/demo22/doc.md
+++ b/src/pages/demo/d2-crud/demo22/doc.md
@@ -1 +1 @@
-通过给 `D2 Crud` 传入 `form-rules` 可开启表单校验，校验规则参见：[async-validator](https://github.com/yiminghe/async-validator)。代码如下：
+通过给 `D2 Crud` 传入 `add-rules` 或 `edit-rules` 可开启新增/修改表单校验，校验规则参见：[async-validator](https://github.com/yiminghe/async-validator)。代码如下：
diff --git a/src/pages/demo/d2-crud/demo22/index.vue b/src/pages/demo/d2-crud/demo22/index.vue
index 224f2995..09407bf6 100644
--- a/src/pages/demo/d2-crud/demo22/index.vue
+++ b/src/pages/demo/d2-crud/demo22/index.vue
@@ -2,15 +2,15 @@
   <d2-container :filename="filename">
     <template slot="header">表单校验</template>
     <d2-crud
+      ref="d2Crud"
       :columns="columns"
       :data="data"
-      add-mode
-      :add-button="addButton"
-      :form-template="formTemplate"
+      :add-template="addTemplate"
       :form-options="formOptions"
-      :form-rules="formRules"
+      :add-rules="addRules"
       @row-add="handleRowAdd"
       @dialog-cancel="handleDialogCancel">
+      <el-button slot="header" style="margin-bottom: 5px" @click="addRow">新增</el-button>
     </d2-crud>
     <el-card shadow="never" class="d2-mb">
       <d2-markdown :source="doc"/>
@@ -75,7 +75,7 @@ export default {
         icon: 'el-icon-plus',
         size: 'small'
       },
-      formTemplate: {
+      addTemplate: {
         date: {
           title: '日期',
           value: ''
@@ -94,7 +94,7 @@ export default {
         labelPosition: 'left',
         saveLoading: false
       },
-      formRules: {
+      addRules: {
         date: [ { required: true, message: '请输入日期', trigger: 'blur' } ],
         name: [ { required: true, message: '请输入姓名', trigger: 'blur' } ],
         address: [ { required: true, message: '请输入地址', trigger: 'blur' } ]
@@ -102,6 +102,11 @@ export default {
     }
   },
   methods: {
+    addRow () {
+      this.$refs.d2Crud.showDialog({
+        mode: 'add'
+      })
+    },
     handleRowAdd (row, done) {
       this.formOptions.saveLoading = true
       setTimeout(() => {
diff --git a/yarn.lock.REMOVED.git-id b/yarn.lock.REMOVED.git-id
index 755e2e0e..d1de7f9f 100644
--- a/yarn.lock.REMOVED.git-id
+++ b/yarn.lock.REMOVED.git-id
@@ -1 +1 @@
-0112dcaa59d17f79454b15cb17a0dc1116fdeb13
\ No newline at end of file
+f4643ebdf5dd651b6d5e06f58d00fd84549c6cd3
\ No newline at end of file