From f19cc4c7ab0bf2b8fcf9487986c4c1dd9af2bf34 Mon Sep 17 00:00:00 2001
From: kingwl <wenlu.wang@chaitin.com>
Date: Fri, 2 Jun 2017 17:37:17 +0800
Subject: [PATCH] Cascader: fix invalid zero value (#3470)

---
 packages/cascader/src/menu.vue   |  4 +-
 src/utils/shared.js              |  3 ++
 test/unit/specs/cascader.spec.js | 91 ++++++++++++++++++++++++++++++++
 3 files changed, 97 insertions(+), 1 deletion(-)
 create mode 100644 src/utils/shared.js

diff --git a/packages/cascader/src/menu.vue b/packages/cascader/src/menu.vue
index 8958bf0c6..b1daee966 100644
--- a/packages/cascader/src/menu.vue
+++ b/packages/cascader/src/menu.vue
@@ -1,4 +1,6 @@
 <script>
+  import { isDef } from 'element-ui/src/utils/shared';
+
   export default {
     name: 'ElCascaderMenu',
 
@@ -54,7 +56,7 @@
             const level = activeOptions.length;
             activeOptions[level] = options;
             let active = activeValue[level];
-            if (active) {
+            if (isDef(active)) {
               options = options.filter(option => option.value === active)[0];
               if (options && options.children) {
                 loadActiveOptions(options.children, activeOptions);
diff --git a/src/utils/shared.js b/src/utils/shared.js
new file mode 100644
index 000000000..a81e77ea4
--- /dev/null
+++ b/src/utils/shared.js
@@ -0,0 +1,3 @@
+export function isDef(val) {
+  return val !== undefined && val !== null;
+}
diff --git a/test/unit/specs/cascader.spec.js b/test/unit/specs/cascader.spec.js
index 5d024e768..9a5564754 100644
--- a/test/unit/specs/cascader.spec.js
+++ b/test/unit/specs/cascader.spec.js
@@ -96,6 +96,97 @@ describe('Cascader', () => {
       });
     }, 300);
   });
+  // Github issue #3470
+  it('should work with zero', done => {
+    vm = createVue({
+      template: `
+        <el-cascader
+          ref="cascader"
+          placeholder="请选择"
+          :options="options"
+          clearable
+          v-model="selectedOptions"
+        ></el-cascader>
+      `,
+      data() {
+        return {
+          options: [{
+            value: 'zhejiang',
+            label: 'Zhejiang',
+            children: [{
+              value: 0,
+              label: 'Hangzhou',
+              children: [{
+                value: 'xihu',
+                label: 'West Lake'
+              }]
+            }, {
+              value: 'ningbo',
+              label: 'NingBo',
+              children: [{
+                value: 'jiangbei',
+                label: 'Jiang Bei'
+              }]
+            }]
+          }, {
+            value: 'jiangsu',
+            label: 'Jiangsu',
+            children: [{
+              value: 'nanjing',
+              label: 'Nanjing',
+              children: [{
+                value: 'zhonghuamen',
+                label: 'Zhong Hua Men'
+              }]
+            }]
+          }],
+          selectedOptions: []
+        };
+      }
+    }, true);
+    expect(vm.$el).to.be.exist;
+    vm.$el.click();
+    setTimeout(_ => {
+      expect(document.body.querySelector('.el-cascader-menus')).to.be.exist;
+
+      const menu = vm.$refs.cascader.menu;
+      const menuElm = menu.$el;
+      const item1 = menuElm.querySelector('.el-cascader-menu__item');
+
+      item1.click();
+      menu.$nextTick(_ => {
+        expect(menuElm.children.length).to.be.equal(2);
+        expect(item1.classList.contains('is-active')).to.be.true;
+
+        const item2 = menuElm.children[1].querySelector('.el-cascader-menu__item');
+        item2.click();
+
+        menu.$nextTick(_ => {
+          expect(menuElm.children.length).to.be.equal(3);
+          expect(item2.classList.contains('is-active')).to.be.true;
+
+          const item3 = menuElm.children[2].querySelector('.el-cascader-menu__item');
+          item3.click();
+
+          setTimeout(_ => {
+            expect(document.body.querySelector('.el-cascader-menus').style.display).to.be.equal('none');
+            expect(vm.selectedOptions[0]).to.be.equal('zhejiang');
+            expect(vm.selectedOptions[1]).to.be.equal(0);
+            expect(vm.selectedOptions[2]).to.be.equal('xihu');
+
+            triggerEvent(vm.$refs.cascader.$el, 'mouseenter');
+            vm.$nextTick(_ => {
+              vm.$refs.cascader.$el.querySelector('.el-cascader__clearIcon').click();
+              vm.$nextTick(_ => {
+                expect(vm.selectedOptions.length).to.be.equal(0);
+                done();
+              });
+            });
+          }, 500);
+        });
+      });
+    }, 300);
+  });
   it('not allow clearable', done => {
     vm = createVue({
       template: `