From 3f147953871823936f07af093e3d847bad9e29d5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= <chenjiahan@youzan.com>
Date: Thu, 20 Feb 2020 16:32:14 +0800
Subject: [PATCH] feat(Form): add scrollToField method (#5680)

---
 src/form/README.md            |  1 +
 src/form/README.zh-CN.md      |  1 +
 src/form/index.js             |  9 +++++++++
 src/form/test/methods.spec.js | 16 +++++++++++++++-
 4 files changed, 26 insertions(+), 1 deletion(-)

diff --git a/src/form/README.md b/src/form/README.md
index 7a462f55e..70863cb54 100644
--- a/src/form/README.md
+++ b/src/form/README.md
@@ -438,6 +438,7 @@ Use [ref](https://vuejs.org/v2/api/#ref) to get Form instance and call instance
 | submit | Submit form | - | - |
 | validate | Validate form | *name?: string* | *Promise* |
 | resetValidation | Reset validation | *name?: string* | - |
+| scrollToField `v2.5.2` | Scroll to field | *name: string* | - |
 
 ### Slots
 
diff --git a/src/form/README.zh-CN.md b/src/form/README.zh-CN.md
index 742e5dd2b..7e2c19a50 100644
--- a/src/form/README.zh-CN.md
+++ b/src/form/README.zh-CN.md
@@ -474,6 +474,7 @@ export default {
 | submit | 提交表单，与点击提交按钮的效果等价 | - | - |
 | validate | 验证表单，支持传入`name`来验证单个表单项 | *name?: string* | *Promise* |
 | resetValidation | 重置表单项的验证提示，支持传入`name`来重置单个表单项 | *name?: string* | - |
+| scrollToField `v2.5.2` | 滚动到对应表单项的位置 | *name: string* | - |
 
 ### Slots
 
diff --git a/src/form/index.js b/src/form/index.js
index 29a7b621c..8ce4aea4d 100644
--- a/src/form/index.js
+++ b/src/form/index.js
@@ -106,6 +106,15 @@ export default createComponent({
       });
     },
 
+    // @exposed-api
+    scrollToField(name) {
+      this.fields.forEach(item => {
+        if (item.name === name) {
+          item.$el.scrollIntoView();
+        }
+      });
+    },
+
     getValues() {
       return this.fields.reduce((form, field) => {
         form[field.name] = field.formValue;
diff --git a/src/form/test/methods.spec.js b/src/form/test/methods.spec.js
index 4354c9ca7..98a771aaf 100644
--- a/src/form/test/methods.spec.js
+++ b/src/form/test/methods.spec.js
@@ -1,4 +1,4 @@
-import { later } from '../../../test';
+import { later, mockScrollIntoView } from '../../../test';
 import { mountForm, mountSimpleRulesForm, getSimpleRules } from './shared';
 
 test('submit method', async () => {
@@ -96,3 +96,17 @@ test('resetValidation method - reset one field', done => {
     },
   });
 });
+
+test('scrollToField method', done => {
+  const fn = mockScrollIntoView();
+  mountSimpleRulesForm({
+    mounted() {
+      this.$refs.form.scrollToField('unknown');
+      expect(fn).toHaveBeenCalledTimes(0);
+
+      this.$refs.form.scrollToField('A');
+      expect(fn).toHaveBeenCalledTimes(1);
+      done();
+    },
+  });
+});