From 287a4acea0a72b74c64c4a81499ac7de94141761 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Wed, 4 Nov 2020 20:03:38 +0800
Subject: [PATCH] fix(Picker): move to next option when default option is
 disabled (#7499)

* fix(Picker): should move to next option when defaultOption is disabled

* test: update spec name
---
 src/picker/index.js                           | 12 +++++--
 .../test/__snapshots__/cascade.spec.js.snap   | 31 +++++++++++++++++++
 src/picker/test/cascade.spec.js               | 20 ++++++++++++
 3 files changed, 61 insertions(+), 2 deletions(-)

diff --git a/src/picker/index.js b/src/picker/index.js
index 805a0062f..5b5a379b1 100644
--- a/src/picker/index.js
+++ b/src/picker/index.js
@@ -86,7 +86,15 @@ export default createComponent({
       let cursor = { children: this.columns };
 
       while (cursor && cursor.children) {
-        const defaultIndex = cursor.defaultIndex ?? +this.defaultIndex;
+        const { children } = cursor;
+        let defaultIndex = cursor.defaultIndex ?? +this.defaultIndex;
+
+        while (
+          children[defaultIndex].disabled &&
+          defaultIndex < children.length - 1
+        ) {
+          defaultIndex++;
+        }
 
         formatted.push({
           values: cursor.children,
@@ -94,7 +102,7 @@ export default createComponent({
           defaultIndex,
         });
 
-        cursor = cursor.children[defaultIndex];
+        cursor = children[defaultIndex];
       }
 
       this.formattedColumns = formatted;
diff --git a/src/picker/test/__snapshots__/cascade.spec.js.snap b/src/picker/test/__snapshots__/cascade.spec.js.snap
index c6decf9d7..09e3c4952 100644
--- a/src/picker/test/__snapshots__/cascade.spec.js.snap
+++ b/src/picker/test/__snapshots__/cascade.spec.js.snap
@@ -5,3 +5,34 @@ exports[`disabled in cascade 1`] = `
   <div class="van-ellipsis">A2</div>
 </li>
 `;
+
+exports[`should move to next option when default option is disabled 1`] = `
+<div class="van-picker">
+  <!---->
+  <div class="van-picker__columns" style="height: 264px;">
+    <div class="van-picker-column">
+      <ul class="van-picker-column__wrapper" style="transform: translate3d(0, 66px, 0); transition-duration: 0ms; transition-property: none;">
+        <li role="button" tabindex="-1" class="van-picker-column__item van-picker-column__item--disabled" style="height: 44px;">
+          <div class="van-ellipsis">A1</div>
+        </li>
+        <li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
+          <div class="van-ellipsis">A2</div>
+        </li>
+      </ul>
+    </div>
+    <div class="van-picker-column">
+      <ul class="van-picker-column__wrapper" style="transform: translate3d(0, 110px, 0); transition-duration: 0ms; transition-property: none;">
+        <li role="button" tabindex="0" class="van-picker-column__item van-picker-column__item--selected" style="height: 44px;">
+          <div class="van-ellipsis">B3</div>
+        </li>
+        <li role="button" tabindex="0" class="van-picker-column__item" style="height: 44px;">
+          <div class="van-ellipsis">B4</div>
+        </li>
+      </ul>
+    </div>
+    <div class="van-picker__mask" style="background-size: 100% 110px;"></div>
+    <div class="van-hairline-unset--top-bottom van-picker__frame" style="height: 44px;"></div>
+  </div>
+  <!---->
+</div>
+`;
diff --git a/src/picker/test/cascade.spec.js b/src/picker/test/cascade.spec.js
index 02e7cd2da..7fce043eb 100644
--- a/src/picker/test/cascade.spec.js
+++ b/src/picker/test/cascade.spec.js
@@ -125,3 +125,23 @@ test('disabled in cascade', () => {
 
   expect(wrapper.find('.van-picker-column__item--disabled')).toMatchSnapshot();
 });
+
+test('should move to next option when default option is disabled', () => {
+  const wrapper = mount(Picker, {
+    propsData: {
+      columns: [
+        {
+          text: 'A1',
+          disabled: true,
+          children: [{ text: 'B1' }, { text: 'B2' }],
+        },
+        {
+          text: 'A2',
+          children: [{ text: 'B3' }, { text: 'B4' }],
+        },
+      ],
+    },
+  });
+
+  expect(wrapper).toMatchSnapshot();
+});