add cascader en docs

examples/docs/zh-CN/cascader.md

@@ -152,7 +152,9 @@
 ```
 :::
 
-### 禁用值
+### 禁用选项
+
+通过在数据源中设置 `disabled` 字段来声明该选项时禁用的
 
 :::demo
 ```html

examples/nav.config.json

@@ -76,6 +76,10 @@
               "path": "/select",
               "title": "Select 选择器"
             },
+            {
+              "path": "/cascader",
+              "title": "Cascader 级联选择"
+            },
             {
               "path": "/switch",
               "title": "Switch 开关"
@@ -215,10 +219,6 @@
             {
               "path": "/collapse",
               "title": "Collapse 折叠面板"
-            },
-            {
-              "path": "/cascader",
-              "title": "Cascader 级联选择"
             }
           ]
         }
@@ -302,6 +302,10 @@
               "path": "/select",
               "title": "Select"
             },
+            {
+              "path": "/cascader",
+              "title": "Cascader"
+            },
             {
               "path": "/switch",
               "title": "Switch"
@@ -441,10 +445,6 @@
             {
               "path": "/collapse",
               "title": "Collapse"
-            },
-            {
-              "path": "/cascader",
-              "title": "Cascader"
             }
           ]
         }

packages/cascader/src/main.vue

@@ -2,10 +2,13 @@
   <span
     class="el-cascader"
     :class="[
-      { 'is-opened': menuVisible },
+      {
+        'is-opened': menuVisible,
+        'is-disabled': disabled
+      },
       size ? 'el-cascader--' + size : ''
     ]"
-    @click="menuVisible = !menuVisible"
+    @click="handleClick"
     @mouseenter="inputHover = true"
     @mouseleave="inputHover = false"
     ref="reference"
@@ -18,6 +21,7 @@
       @change="handleInputChange"
       :validate-event="false"
       :size="size"
+      :disabled="disabled"
     >
       <template slot="icon">
         <i
@@ -209,6 +213,11 @@ export default {
     },
     handleClickoutside() {
       this.menuVisible = false;
+    },
+    handleClick() {
+      if (!this.disabled) {
+        this.menuVisible = !this.menuVisible;
+      }
     }
   }
 };