1 line
126 KiB
JavaScript
1 line
126 KiB
JavaScript
(window.webpackJsonp=window.webpackJsonp||[]).push([[32],{1229:function(s,a,n){},1325:function(s,a,n){"use strict";var t=n(1229);n.n(t).a},1423:function(s,a,n){"use strict";n.r(a);var t=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <a-cascader :options="options" @change="onChange" placeholder="Please select"/>\n',script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n",style:null,us:"\n#### Basic\nCascade selection box for selecting province/city/district.\n",cn:"\n#### 基本\n省市区级联。\n",sourceCode:"<template>\n <a-cascader :options=\"options\" @change=\"onChange\" placeholder=\"Please select\" />\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("a-cascader",{attrs:{options:s.options,placeholder:"Please select"},on:{change:s.onChange}})],1),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"基本"}},[s._v("基本 "),n("a",{staticClass:"anchor",attrs:{href:"#基本"}},[s._v("#")])]),s._v(" "),n("p",[s._v("省市区级联。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Basic"}},[s._v("Basic "),n("a",{staticClass:"anchor",attrs:{href:"#Basic"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Cascade selection box for selecting province/city/district.")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("placeholder")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"Please select"')]),s._v(" />")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};t._withStripped=!0;var l={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake"}]}]},{value:"jiangsu",label:"Jiangsu",children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua Men"}]}]}]}},methods:{onChange:function(s){console.log(s)}}},e=n(31),v=Object(e.a)(l,t,[],!1,null,null,null);v.options.__file="components/cascader/demo/basic.md";var i=v.exports,_=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <a-cascader :options="options" @change="onChange" changeOnSelect=""/>\n',script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n",style:null,us:"\n#### Change on select\nAllow only select parent options.\n",cn:"\n#### 选择即改变\n这种交互允许只选中父级选项。\n",sourceCode:"<template>\n <a-cascader :options=\"options\" @change=\"onChange\" changeOnSelect />\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("a-cascader",{attrs:{options:s.options,changeOnSelect:""},on:{change:s.onChange}})],1),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"选择即改变"}},[s._v("选择即改变 "),n("a",{staticClass:"anchor",attrs:{href:"#选择即改变"}},[s._v("#")])]),s._v(" "),n("p",[s._v("这种交互允许只选中父级选项。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Change-on-select"}},[s._v("Change on select "),n("a",{staticClass:"anchor",attrs:{href:"#Change-on-select"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Allow only select parent options.")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("changeOnSelect")]),s._v(" />")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};_._withStripped=!0;var c={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake"}]}]},{value:"jiangsu",label:"Jiangsu",children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua Men"}]}]}]}},methods:{onChange:function(s){console.log(s)}}},o=Object(e.a)(c,_,[],!1,null,null,null);o.options.__file="components/cascader/demo/change-on-select.md";var h=o.exports,r=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <a-cascader :options="options" :defaultValue="[\'zhejiang\', \'hangzhou\', \'xihu\']" style="width: 100%">\n <template slot="displayRender" slot-scope="{labels, selectedOptions}">\n <span v-for="(label, index) in labels" :key="selectedOptions[index].value">\n <span v-if="index === labels.length - 1">\n {{label}} (<a @click="e => handleAreaClick(e, label, selectedOptions[index])">{{selectedOptions[index].code}}</a>)\n </span>\n <span v-else="" @click="onChange">\n {{label}} /\n </span>\n </span>\n </template>\n </a-cascader>\n',script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n code: 752100,\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n code: 453400,\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n handleAreaClick(e, label, option) {\n e.stopPropagation();\n console.log('clicked', label, option);\n },\n },\n };\n",style:null,us:"\n#### Custom render\nFor instance, add an external link after the selected value.\n",cn:"\n#### 自定义已选项\n例如给最后一项加上邮编链接。\n",sourceCode:"<template>\n <a-cascader\n :options=\"options\"\n :defaultValue=\"['zhejiang', 'hangzhou', 'xihu']\"\n style=\"width: 100%\"\n >\n <template slot=\"displayRender\" slot-scope=\"{labels, selectedOptions}\">\n <span v-for=\"(label, index) in labels\" :key=\"selectedOptions[index].value\">\n <span v-if=\"index === labels.length - 1\">\n {{label}} (<a @click=\"e => handleAreaClick(e, label, selectedOptions[index])\"\n >{{selectedOptions[index].code}}</a\n >)\n </span>\n <span v-else @click=\"onChange\">\n {{label}} /\n </span>\n </span>\n </template>\n </a-cascader>\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n code: 752100,\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n code: 453400,\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n handleAreaClick(e, label, option) {\n e.stopPropagation();\n console.log('clicked', label, option);\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("a-cascader",{staticStyle:{width:"100%"},attrs:{options:s.options,defaultValue:["zhejiang","hangzhou","xihu"]},scopedSlots:s._u([{key:"displayRender",fn:function(a){var t=a.labels,l=a.selectedOptions;return s._l(t,(function(a,e){return n("span",{key:l[e].value},[e===t.length-1?n("span",[s._v("\n "+s._s(a)+" ("),n("a",{on:{click:function(n){return s.handleAreaClick(n,a,l[e])}}},[s._v(s._s(l[e].code))]),s._v(")\n ")]):n("span",{on:{click:s.onChange}},[s._v("\n "+s._s(a)+" /\n ")])])}))}}])})],1),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"自定义已选项"}},[s._v("自定义已选项 "),n("a",{staticClass:"anchor",attrs:{href:"#自定义已选项"}},[s._v("#")])]),s._v(" "),n("p",[s._v("例如给最后一项加上邮编链接。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Custom-render"}},[s._v("Custom render "),n("a",{staticClass:"anchor",attrs:{href:"#Custom-render"}},[s._v("#")])]),s._v(" "),n("p",[s._v("For instance, add an external link after the selected value.")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":defaultValue")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v("\"['zhejiang', 'hangzhou', 'xihu']\"")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("style")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"width: 100%"')]),s._v("\n >")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"displayRender"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("slot-scope")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"{labels, selectedOptions}"')]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("v-for")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"(label, index) in labels"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v(":key")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"selectedOptions[index].value"')]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("v-if")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"index === labels.length - 1"')]),s._v(">")]),s._v("\n "),n("span",[s._v("{{")]),s._v("label"),n("span",[s._v("}}")]),s._v(" ("),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("@click")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"e => handleAreaClick(e, label, selectedOptions[index])"')]),s._v("\n >")]),n("span",[s._v("{{")]),s._v("selectedOptions[index].code"),n("span",[s._v("}}")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("a")]),s._v("\n >")]),s._v(")\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("v-else")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("@click")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v(">")]),s._v("\n "),n("span",[s._v("{{")]),s._v("label"),n("span",[s._v("}}")]),s._v(" /\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("code")]),s._v(": "),n("span",{staticClass:"hljs-number"},[s._v("752100")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("code")]),s._v(": "),n("span",{staticClass:"hljs-number"},[s._v("453400")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n handleAreaClick(e, label, option) {\n e.stopPropagation();\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log("),n("span",{staticClass:"hljs-string"},[s._v("'clicked'")]),s._v(", label, option);\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};r._withStripped=!0;var p={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake",code:752100}]}]},{value:"jiangsu",label:"Jiangsu",children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua Men",code:453400}]}]}]}},methods:{onChange:function(s){console.log(s)},handleAreaClick:function(s,a,n){s.stopPropagation(),console.log("clicked",a,n)}}},d=Object(e.a)(p,r,[],!1,null,null,null);d.options.__file="components/cascader/demo/custom-render.md";var u=d.exports,g=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <span>\n {{text}} \n <a-cascader :options="options" @change="onChange">\n <a href="#">Change city</a>\n </a-cascader>\n </span>\n',script:"\n export default {\n data() {\n return {\n text: 'Unselect',\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value, selectedOptions) {\n this.text = selectedOptions.map(o => o.label).join(', ');\n },\n },\n };\n",style:null,us:"\n#### Custom trigger\nSeparate trigger button and result.\n",cn:"\n#### 可以自定义显示\n切换按钮和结果分开。\n",sourceCode:"<template>\n <span>\n {{text}} \n <a-cascader :options=\"options\" @change=\"onChange\">\n <a href=\"#\">Change city</a>\n </a-cascader>\n </span>\n</template>\n<script>\n export default {\n data() {\n return {\n text: 'Unselect',\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value, selectedOptions) {\n this.text = selectedOptions.map(o => o.label).join(', ');\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("span",[s._v("\n "+s._s(s.text)+" \n "),n("a-cascader",{attrs:{options:s.options},on:{change:s.onChange}},[n("a",{attrs:{href:"#"}},[s._v("Change city")])])],1)]),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"可以自定义显示"}},[s._v("可以自定义显示 "),n("a",{staticClass:"anchor",attrs:{href:"#可以自定义显示"}},[s._v("#")])]),s._v(" "),n("p",[s._v("切换按钮和结果分开。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Custom-trigger"}},[s._v("Custom trigger "),n("a",{staticClass:"anchor",attrs:{href:"#Custom-trigger"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Separate trigger button and result.")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(">")]),s._v("\n "),n("span",[s._v("{{")]),s._v("text"),n("span",[s._v("}}")]),s._v(" \n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("href")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"#"')]),s._v(">")]),s._v("Change city"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("a")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("span")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("text")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Unselect'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value, selectedOptions) {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".text = selectedOptions.map("),n("span",{staticClass:"hljs-function"},[n("span",{staticClass:"hljs-params"},[s._v("o")]),s._v(" =>")]),s._v(" o.label).join("),n("span",{staticClass:"hljs-string"},[s._v("', '")]),s._v(");\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};g._withStripped=!0;var j={data:function(){return{text:"Unselect",options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake"}]}]},{value:"jiangsu",label:"Jiangsu",children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua Men"}]}]}]}},methods:{onChange:function(s,a){this.text=a.map((function(s){return s.label})).join(", ")}}},C=Object(e.a)(j,g,[],!1,null,null,null);C.options.__file="components/cascader/demo/custom-trigger.md";var m=C.exports,b=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:"\n <a-cascader :options=\"options\" @change=\"onChange\" :defaultValue=\"['zhejiang', 'hangzhou', 'xihu']\"/>\n",script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n",style:null,us:"\n#### Default value\nSpecifies default value by an array.\n",cn:"\n#### 默认值\n默认值通过数组的方式指定。\n",sourceCode:"<template>\n <a-cascader\n :options=\"options\"\n @change=\"onChange\"\n :defaultValue=\"['zhejiang', 'hangzhou', 'xihu']\"\n />\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("a-cascader",{attrs:{options:s.options,defaultValue:["zhejiang","hangzhou","xihu"]},on:{change:s.onChange}})],1),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"默认值"}},[s._v("默认值 "),n("a",{staticClass:"anchor",attrs:{href:"#默认值"}},[s._v("#")])]),s._v(" "),n("p",[s._v("默认值通过数组的方式指定。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Default-value"}},[s._v("Default value "),n("a",{staticClass:"anchor",attrs:{href:"#Default-value"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Specifies default value by an array.")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":defaultValue")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v("\"['zhejiang', 'hangzhou', 'xihu']\"")]),s._v("\n />")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};b._withStripped=!0;var f={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake"}]}]},{value:"jiangsu",label:"Jiangsu",children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua Men"}]}]}]}},methods:{onChange:function(s){console.log(s)}}},z=Object(e.a)(f,b,[],!1,null,null,null);z.options.__file="components/cascader/demo/default-value.md";var x=z.exports,y=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <a-cascader :options="options" @change="onChange"/>\n',script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n disabled: true,\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n",style:null,us:"\n#### Disabled option\nDisable option by specifying the `disabled` property in `options`.\n",cn:"\n#### 禁用选项\n通过指定 options 里的 `disabled` 字段。\n",sourceCode:"<template>\n <a-cascader :options=\"options\" @change=\"onChange\" />\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n disabled: true,\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("a-cascader",{attrs:{options:s.options},on:{change:s.onChange}})],1),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"禁用选项"}},[s._v("禁用选项 "),n("a",{staticClass:"anchor",attrs:{href:"#禁用选项"}},[s._v("#")])]),s._v(" "),n("p",[s._v("通过指定 options 里的 "),n("code",[s._v("disabled")]),s._v(" 字段。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Disabled-option"}},[s._v("Disabled option "),n("a",{staticClass:"anchor",attrs:{href:"#Disabled-option"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Disable option by specifying the "),n("code",[s._v("disabled")]),s._v(" property in "),n("code",[s._v("options")]),s._v(".")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v(" />")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("disabled")]),s._v(": "),n("span",{staticClass:"hljs-literal"},[s._v("true")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};y._withStripped=!0;var k={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake"}]}]},{value:"jiangsu",label:"Jiangsu",disabled:!0,children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua Men"}]}]}]}},methods:{onChange:function(s){console.log(s)}}},w=Object(e.a)(k,y,[],!1,null,null,null);w.options.__file="components/cascader/demo/disabled-option.md";var H=w.exports,O=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <a-cascader :options="options" :displayRender="displayRender" expandTrigger="hover" @change="onChange" placeholder="Please select"/>\n',script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n displayRender({ labels }) {\n return labels[labels.length - 1];\n },\n },\n };\n",style:null,us:"\n#### Hover\nHover to expand sub menu, click to select option.\n",cn:"\n#### 移入展开\n通过移入展开下级菜单,点击完成选择。\n",sourceCode:"<template>\n <a-cascader\n :options=\"options\"\n :displayRender=\"displayRender\"\n expandTrigger=\"hover\"\n @change=\"onChange\"\n placeholder=\"Please select\"\n />\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n displayRender({ labels }) {\n return labels[labels.length - 1];\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("a-cascader",{attrs:{options:s.options,displayRender:s.displayRender,expandTrigger:"hover",placeholder:"Please select"},on:{change:s.onChange}})],1),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"移入展开"}},[s._v("移入展开 "),n("a",{staticClass:"anchor",attrs:{href:"#移入展开"}},[s._v("#")])]),s._v(" "),n("p",[s._v("通过移入展开下级菜单,点击完成选择。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Hover"}},[s._v("Hover "),n("a",{staticClass:"anchor",attrs:{href:"#Hover"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Hover to expand sub menu, click to select option.")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":displayRender")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"displayRender"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("expandTrigger")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"hover"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("placeholder")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"Please select"')]),s._v("\n />")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n displayRender({ labels }) {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" labels[labels.length - "),n("span",{staticClass:"hljs-number"},[s._v("1")]),s._v("];\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};O._withStripped=!0;var Z={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake"}]}]},{value:"jiangsu",label:"Jiangsu",children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua Men"}]}]}]}},methods:{onChange:function(s){console.log(s)},displayRender:function(s){var a=s.labels;return a[a.length-1]}}},N=Object(e.a)(Z,O,[],!1,null,null,null);N.options.__file="components/cascader/demo/hover.md";var S=N.exports,L=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <a-cascader :options="options" @change="onChange" :loadData="loadData" placeholder="Please select" changeOnSelect=""/>\n',script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n isLeaf: false,\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n isLeaf: false,\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n loadData(selectedOptions) {\n const targetOption = selectedOptions[selectedOptions.length - 1];\n targetOption.loading = true;\n\n // load options lazily\n setTimeout(() => {\n targetOption.loading = false;\n targetOption.children = [\n {\n label: `${targetOption.label} Dynamic 1`,\n value: 'dynamic1',\n },\n {\n label: `${targetOption.label} Dynamic 2`,\n value: 'dynamic2',\n },\n ];\n this.options = [...this.options];\n }, 1000);\n },\n },\n };\n",style:null,us:"\n#### Load Options Lazily\nLoad options lazily with `loadData`.\n> Note: `loadData` cannot work with `showSearch`.\n",cn:"\n#### 动态加载选项\n使用 `loadData` 实现动态加载选项。\n> 注意:`loadData` 与 `showSearch` 无法一起使用。\n",sourceCode:"<template>\n <a-cascader\n :options=\"options\"\n @change=\"onChange\"\n :loadData=\"loadData\"\n placeholder=\"Please select\"\n changeOnSelect\n />\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n isLeaf: false,\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n isLeaf: false,\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n loadData(selectedOptions) {\n const targetOption = selectedOptions[selectedOptions.length - 1];\n targetOption.loading = true;\n\n // load options lazily\n setTimeout(() => {\n targetOption.loading = false;\n targetOption.children = [\n {\n label: `${targetOption.label} Dynamic 1`,\n value: 'dynamic1',\n },\n {\n label: `${targetOption.label} Dynamic 2`,\n value: 'dynamic2',\n },\n ];\n this.options = [...this.options];\n }, 1000);\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("a-cascader",{attrs:{options:s.options,loadData:s.loadData,placeholder:"Please select",changeOnSelect:""},on:{change:s.onChange}})],1),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"动态加载选项"}},[s._v("动态加载选项 "),n("a",{staticClass:"anchor",attrs:{href:"#动态加载选项"}},[s._v("#")])]),s._v(" "),n("p",[s._v("使用 "),n("code",[s._v("loadData")]),s._v(" 实现动态加载选项。")]),s._v(" "),n("blockquote",[n("p",[s._v("注意:"),n("code",[s._v("loadData")]),s._v(" 与 "),n("code",[s._v("showSearch")]),s._v(" 无法一起使用。")])])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Load-Options-Lazily"}},[s._v("Load Options Lazily "),n("a",{staticClass:"anchor",attrs:{href:"#Load-Options-Lazily"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Load options lazily with "),n("code",[s._v("loadData")]),s._v(".")]),s._v(" "),n("blockquote",[n("p",[s._v("Note: "),n("code",[s._v("loadData")]),s._v(" cannot work with "),n("code",[s._v("showSearch")]),s._v(".")])])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":loadData")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"loadData"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("placeholder")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"Please select"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("changeOnSelect")]),s._v("\n />")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("isLeaf")]),s._v(": "),n("span",{staticClass:"hljs-literal"},[s._v("false")]),s._v(",\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("isLeaf")]),s._v(": "),n("span",{staticClass:"hljs-literal"},[s._v("false")]),s._v(",\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n loadData(selectedOptions) {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("const")]),s._v(" targetOption = selectedOptions[selectedOptions.length - "),n("span",{staticClass:"hljs-number"},[s._v("1")]),s._v("];\n targetOption.loading = "),n("span",{staticClass:"hljs-literal"},[s._v("true")]),s._v(";\n\n "),n("span",{staticClass:"hljs-comment"},[s._v("// load options lazily")]),s._v("\n setTimeout("),n("span",{staticClass:"hljs-function"},[n("span",{staticClass:"hljs-params"},[s._v("()")]),s._v(" =>")]),s._v(" {\n targetOption.loading = "),n("span",{staticClass:"hljs-literal"},[s._v("false")]),s._v(";\n targetOption.children = [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("`"),n("span",{staticClass:"hljs-subst"},[s._v("${targetOption.label}")]),s._v(" Dynamic 1`")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'dynamic1'")]),s._v(",\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("`"),n("span",{staticClass:"hljs-subst"},[s._v("${targetOption.label}")]),s._v(" Dynamic 2`")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'dynamic2'")]),s._v(",\n },\n ];\n "),n("span",{staticClass:"hljs-keyword"},[s._v("this")]),s._v(".options = [...this.options];\n }, "),n("span",{staticClass:"hljs-number"},[s._v("1000")]),s._v(");\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};L._withStripped=!0;var W=n(15),J=n.n(W),D={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",isLeaf:!1},{value:"jiangsu",label:"Jiangsu",isLeaf:!1}]}},methods:{onChange:function(s){console.log(s)},loadData:function(s){var a=this,n=s[s.length-1];n.loading=!0,setTimeout((function(){n.loading=!1,n.children=[{label:n.label+" Dynamic 1",value:"dynamic1"},{label:n.label+" Dynamic 2",value:"dynamic2"}],a.options=[].concat(J()(a.options))}),1e3)}}},P=Object(e.a)(D,L,[],!1,null,null,null);P.options.__file="components/cascader/demo/lazy.md";var M=P.exports,V=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <a-cascader :options="options" :showSearch="{filter}" @change="onChange" placeholder="Please select"/>\n',script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n {\n value: 'xiasha',\n label: 'Xia Sha',\n disabled: true,\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value, selectedOptions) {\n console.log(value, selectedOptions);\n },\n filter(inputValue, path) {\n return path.some(\n option => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1,\n );\n },\n },\n };\n",style:null,us:"\n#### Search\nSearch and select options directly.\n> Now, `Cascader[showSearch]` doesn't support search on server, more info [#5547](https://github.com/ant-design/ant-design/issues/5547)\n",cn:"\n#### 搜索\n可以直接搜索选项并选择。\n> `Cascader[showSearch]` 暂不支持服务端搜索,更多信息见 [#5547](https://github.com/ant-design/ant-design/issues/5547)\n",sourceCode:"<template>\n <a-cascader\n :options=\"options\"\n :showSearch=\"{filter}\"\n @change=\"onChange\"\n placeholder=\"Please select\"\n />\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n {\n value: 'xiasha',\n label: 'Xia Sha',\n disabled: true,\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value, selectedOptions) {\n console.log(value, selectedOptions);\n },\n filter(inputValue, path) {\n return path.some(\n option => option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > -1,\n );\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("a-cascader",{attrs:{options:s.options,showSearch:{filter:s.filter},placeholder:"Please select"},on:{change:s.onChange}})],1),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"搜索"}},[s._v("搜索 "),n("a",{staticClass:"anchor",attrs:{href:"#搜索"}},[s._v("#")])]),s._v(" "),n("p",[s._v("可以直接搜索选项并选择。")]),s._v(" "),n("blockquote",[n("p",[n("code",[s._v("Cascader[showSearch]")]),s._v(" 暂不支持服务端搜索,更多信息见 "),n("a",{attrs:{href:"https://github.com/ant-design/ant-design/issues/5547"}},[s._v("#5547")])])])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Search"}},[s._v("Search "),n("a",{staticClass:"anchor",attrs:{href:"#Search"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Search and select options directly.")]),s._v(" "),n("blockquote",[n("p",[s._v("Now, "),n("code",[s._v("Cascader[showSearch]")]),s._v(" doesn't support search on server, more info "),n("a",{attrs:{href:"https://github.com/ant-design/ant-design/issues/5547"}},[s._v("#5547")])])])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":showSearch")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"{filter}"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("placeholder")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"Please select"')]),s._v("\n />")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xiasha'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Xia Sha'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("disabled")]),s._v(": "),n("span",{staticClass:"hljs-literal"},[s._v("true")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value, selectedOptions) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value, selectedOptions);\n },\n filter(inputValue, path) {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" path.some(\n "),n("span",{staticClass:"hljs-function"},[n("span",{staticClass:"hljs-params"},[s._v("option")]),s._v(" =>")]),s._v(" option.label.toLowerCase().indexOf(inputValue.toLowerCase()) > "),n("span",{staticClass:"hljs-number"},[s._v("-1")]),s._v(",\n );\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};V._withStripped=!0;var R={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake"},{value:"xiasha",label:"Xia Sha",disabled:!0}]}]},{value:"jiangsu",label:"Jiangsu",children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua men"}]}]}]}},methods:{onChange:function(s,a){console.log(s,a)},filter:function(s,a){return a.some((function(a){return a.label.toLowerCase().indexOf(s.toLowerCase())>-1}))}}},$=Object(e.a)(R,V,[],!1,null,null,null);$.options.__file="components/cascader/demo/search.md";var E=$.exports,I=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <div>\n <a-cascader size="large" :options="options" @change="onChange"/><br/><br/>\n <a-cascader :options="options" @change="onChange"/><br/><br/>\n <a-cascader size="small" :options="options" @change="onChange"/><br/><br/>\n </div>\n',script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n",style:null,us:"\n#### Size\nCascade selection box of different sizes.\n",cn:"\n#### 大小\n不同大小的级联选择器。\n",sourceCode:"<template>\n <div>\n <a-cascader size=\"large\" :options=\"options\" @change=\"onChange\" /><br /><br />\n <a-cascader :options=\"options\" @change=\"onChange\" /><br /><br />\n <a-cascader size=\"small\" :options=\"options\" @change=\"onChange\" /><br /><br />\n </div>\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("div",[n("a-cascader",{attrs:{size:"large",options:s.options},on:{change:s.onChange}}),n("br"),n("br"),s._v(" "),n("a-cascader",{attrs:{options:s.options},on:{change:s.onChange}}),n("br"),n("br"),s._v(" "),n("a-cascader",{attrs:{size:"small",options:s.options},on:{change:s.onChange}}),n("br"),n("br")],1)]),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"大小"}},[s._v("大小 "),n("a",{staticClass:"anchor",attrs:{href:"#大小"}},[s._v("#")])]),s._v(" "),n("p",[s._v("不同大小的级联选择器。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Size"}},[s._v("Size "),n("a",{staticClass:"anchor",attrs:{href:"#Size"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Cascade selection box of different sizes.")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("size")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"large"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v(" />")]),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("br")]),s._v(" />")]),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("br")]),s._v(" />")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v(" />")]),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("br")]),s._v(" />")]),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("br")]),s._v(" />")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("size")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"small"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v(" />")]),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("br")]),s._v(" />")]),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("br")]),s._v(" />")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};I._withStripped=!0;var A={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake"}]}]},{value:"jiangsu",label:"Jiangsu",children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua Men"}]}]}]}},methods:{onChange:function(s){console.log(s)}}},F=Object(e.a)(A,I,[],!1,null,null,null);F.options.__file="components/cascader/demo/size.md";var T=F.exports,U=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <a-cascader :fieldNames="{ label: \'name\', value: \'code\', children: \'items\' }" :options="options" @change="onChange" placeholder="Please select"/>\n',script:"\n const options = [\n {\n code: 'zhejiang',\n name: 'Zhejiang',\n items: [\n {\n code: 'hangzhou',\n name: 'Hangzhou',\n items: [\n {\n code: 'xihu',\n name: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n code: 'jiangsu',\n name: 'Jiangsu',\n items: [\n {\n code: 'nanjing',\n name: 'Nanjing',\n items: [\n {\n code: 'zhonghuamen',\n name: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ];\n export default {\n data() {\n return {\n options,\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n",style:null,us:"\n#### Custom Field Names\nCustom Field Names.\n",cn:"\n#### 自定义字段名\n自定义字段名。\n",sourceCode:"<template>\n <a-cascader\n :fieldNames=\"{ label: 'name', value: 'code', children: 'items' }\"\n :options=\"options\"\n @change=\"onChange\"\n placeholder=\"Please select\"\n />\n</template>\n<script>\n const options = [\n {\n code: 'zhejiang',\n name: 'Zhejiang',\n items: [\n {\n code: 'hangzhou',\n name: 'Hangzhou',\n items: [\n {\n code: 'xihu',\n name: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n code: 'jiangsu',\n name: 'Jiangsu',\n items: [\n {\n code: 'nanjing',\n name: 'Nanjing',\n items: [\n {\n code: 'zhonghuamen',\n name: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ];\n export default {\n data() {\n return {\n options,\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("a-cascader",{attrs:{fieldNames:{label:"name",value:"code",children:"items"},options:s.options,placeholder:"Please select"},on:{change:s.onChange}})],1),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"自定义字段名"}},[s._v("自定义字段名 "),n("a",{staticClass:"anchor",attrs:{href:"#自定义字段名"}},[s._v("#")])]),s._v(" "),n("p",[s._v("自定义字段名。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Custom-Field-Names"}},[s._v("Custom Field Names "),n("a",{staticClass:"anchor",attrs:{href:"#Custom-Field-Names"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Custom Field Names.")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":fieldNames")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v("\"{ label: 'name', value: 'code', children: 'items' }\"")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("placeholder")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"Please select"')]),s._v("\n />")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("const")]),s._v(" options = [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("code")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("name")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("items")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("code")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("name")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("items")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("code")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("name")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("code")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("name")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("items")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("code")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("name")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("items")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("code")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("name")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ];\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n options,\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};U._withStripped=!0;var q=[{code:"zhejiang",name:"Zhejiang",items:[{code:"hangzhou",name:"Hangzhou",items:[{code:"xihu",name:"West Lake"}]}]},{code:"jiangsu",name:"Jiangsu",items:[{code:"nanjing",name:"Nanjing",items:[{code:"zhonghuamen",name:"Zhong Hua Men"}]}]}],B={data:function(){return{options:q}},methods:{onChange:function(s){console.log(s)}}},X=Object(e.a)(B,U,[],!1,null,null,null);X.options.__file="components/cascader/demo/fields-name.md";var G=X.exports,K=function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[[n("demo-box",{attrs:{jsfiddle:{html:'\n <div>\n <a-cascader style="margin-top: 1rem" :options="options" @change="onChange" placeholder="Please select">\n <a-icon type="smile" slot="suffixIcon" class="test"/>\n </a-cascader>\n <a-cascader suffixIcon="ab" style="margin-top: 1rem" :options="options" @change="onChange" placeholder="Please select"/>\n </div>\n',script:"\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n",style:null,us:"\n#### Suffix\nCascade selection box for selecting province/city/district.\n",cn:"\n#### 后缀图标\n省市区级联。\n",sourceCode:"<template>\n <div>\n <a-cascader\n style=\"margin-top: 1rem\"\n :options=\"options\"\n @change=\"onChange\"\n placeholder=\"Please select\"\n >\n <a-icon type=\"smile\" slot=\"suffixIcon\" class=\"test\" />\n </a-cascader>\n <a-cascader\n suffixIcon=\"ab\"\n style=\"margin-top: 1rem\"\n :options=\"options\"\n @change=\"onChange\"\n placeholder=\"Please select\"\n />\n </div>\n</template>\n<script>\n export default {\n data() {\n return {\n options: [\n {\n value: 'zhejiang',\n label: 'Zhejiang',\n children: [\n {\n value: 'hangzhou',\n label: 'Hangzhou',\n children: [\n {\n value: 'xihu',\n label: 'West Lake',\n },\n ],\n },\n ],\n },\n {\n value: 'jiangsu',\n label: 'Jiangsu',\n children: [\n {\n value: 'nanjing',\n label: 'Nanjing',\n children: [\n {\n value: 'zhonghuamen',\n label: 'Zhong Hua Men',\n },\n ],\n },\n ],\n },\n ],\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n },\n },\n };\n<\/script>\n"}}},[n("template",{slot:"component"},[n("div",[n("a-cascader",{staticStyle:{"margin-top":"1rem"},attrs:{options:s.options,placeholder:"Please select"},on:{change:s.onChange}},[n("a-icon",{staticClass:"test",attrs:{slot:"suffixIcon",type:"smile"},slot:"suffixIcon"})],1),s._v(" "),n("a-cascader",{staticStyle:{"margin-top":"1rem"},attrs:{suffixIcon:"ab",options:s.options,placeholder:"Please select"},on:{change:s.onChange}})],1)]),s._v(" "),n("template",{slot:"description"},[n("h4",{attrs:{id:"后缀图标"}},[s._v("后缀图标 "),n("a",{staticClass:"anchor",attrs:{href:"#后缀图标"}},[s._v("#")])]),s._v(" "),n("p",[s._v("省市区级联。")])]),s._v(" "),n("template",{slot:"us-description"},[n("h4",{attrs:{id:"Suffix"}},[s._v("Suffix "),n("a",{staticClass:"anchor",attrs:{href:"#Suffix"}},[s._v("#")])]),s._v(" "),n("p",[s._v("Cascade selection box for selecting province/city/district.")])]),s._v(" "),n("template",{slot:"code"},[n("pre",[n("code",{staticClass:"language-html"},[n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("style")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"margin-top: 1rem"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("placeholder")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"Please select"')]),s._v("\n >")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-icon")]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("type")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"smile"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("slot")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"suffixIcon"')]),s._v(" "),n("span",{staticClass:"hljs-attr"},[s._v("class")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"test"')]),s._v(" />")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v(">")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("a-cascader")]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("suffixIcon")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"ab"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("style")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"margin-top: 1rem"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v(":options")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"options"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("@change")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"onChange"')]),s._v("\n "),n("span",{staticClass:"hljs-attr"},[s._v("placeholder")]),s._v("="),n("span",{staticClass:"hljs-string"},[s._v('"Please select"')]),s._v("\n />")]),s._v("\n "),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("div")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("template")]),s._v(">")]),s._v("\n"),n("span",{staticClass:"hljs-tag"},[s._v("<"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),n("span",{staticClass:"javascript"},[s._v("\n "),n("span",{staticClass:"hljs-keyword"},[s._v("export")]),s._v(" "),n("span",{staticClass:"hljs-keyword"},[s._v("default")]),s._v(" {\n data() {\n "),n("span",{staticClass:"hljs-keyword"},[s._v("return")]),s._v(" {\n "),n("span",{staticClass:"hljs-attr"},[s._v("options")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhejiang'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Hangzhou'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'xihu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'West Lake'")]),s._v(",\n },\n ],\n },\n ],\n },\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Jiangsu'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Nanjing'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("children")]),s._v(": [\n {\n "),n("span",{staticClass:"hljs-attr"},[s._v("value")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'zhonghuamen'")]),s._v(",\n "),n("span",{staticClass:"hljs-attr"},[s._v("label")]),s._v(": "),n("span",{staticClass:"hljs-string"},[s._v("'Zhong Hua Men'")]),s._v(",\n },\n ],\n },\n ],\n },\n ],\n };\n },\n "),n("span",{staticClass:"hljs-attr"},[s._v("methods")]),s._v(": {\n onChange(value) {\n "),n("span",{staticClass:"hljs-built_in"},[s._v("console")]),s._v(".log(value);\n },\n },\n };\n")]),n("span",{staticClass:"hljs-tag"},[s._v("</"),n("span",{staticClass:"hljs-name"},[s._v("script")]),s._v(">")]),s._v("\n")])])])],2)]],2)};K._withStripped=!0;var Q={data:function(){return{options:[{value:"zhejiang",label:"Zhejiang",children:[{value:"hangzhou",label:"Hangzhou",children:[{value:"xihu",label:"West Lake"}]}]},{value:"jiangsu",label:"Jiangsu",children:[{value:"nanjing",label:"Nanjing",children:[{value:"zhonghuamen",label:"Zhong Hua Men"}]}]}]}},methods:{onChange:function(s){console.log(s)}}},Y=Object(e.a)(Q,K,[],!1,null,null,null);Y.options.__file="components/cascader/demo/suffix.md";var ss=Y.exports,as=function(){var s=this.$createElement;this._self._c;return this._m(0)};as._withStripped=!0;var ns=Object(e.a)({},as,[function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[n("h2",{attrs:{id:"API"}},[s._v("API "),n("a",{staticClass:"anchor",attrs:{href:"#API"}},[s._v("#")])]),s._v(" "),n("pre",{pre:!0},[n("code",{pre:!0,attrs:{"v-pre":"",class:"language-html"}},[n("span",{pre:!0,attrs:{class:"hljs-tag"}},[s._v("<"),n("span",{pre:!0,attrs:{class:"hljs-name"}},[s._v("a-cascader")]),s._v(" "),n("span",{pre:!0,attrs:{class:"hljs-attr"}},[s._v(":options")]),s._v("="),n("span",{pre:!0,attrs:{class:"hljs-string"}},[s._v('"options"')]),s._v(" "),n("span",{pre:!0,attrs:{class:"hljs-attr"}},[s._v("@change")]),s._v("="),n("span",{pre:!0,attrs:{class:"hljs-string"}},[s._v('"onChange"')]),s._v(" />")]),s._v("\n")])]),s._v(" "),n("table",[n("thead",[n("tr",[n("th",[s._v("参数")]),s._v(" "),n("th",[s._v("说明")]),s._v(" "),n("th",[s._v("类型")]),s._v(" "),n("th",[s._v("默认值")])])]),s._v(" "),n("tbody",[n("tr",[n("td",[s._v("allowClear")]),s._v(" "),n("td",[s._v("是否支持清除")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("true")])]),s._v(" "),n("tr",[n("td",[s._v("autoFocus")]),s._v(" "),n("td",[s._v("自动获取焦点")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("false")])]),s._v(" "),n("tr",[n("td",[s._v("changeOnSelect")]),s._v(" "),n("td",[s._v("当此项为 true 时,点选每级菜单选项值都会发生变化,具体见上面的演示")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("false")])]),s._v(" "),n("tr",[n("td",[s._v("defaultValue")]),s._v(" "),n("td",[s._v("默认的选中项")]),s._v(" "),n("td",[s._v("string[] | number[]")]),s._v(" "),n("td",[s._v("[]")])]),s._v(" "),n("tr",[n("td",[s._v("disabled")]),s._v(" "),n("td",[s._v("禁用")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("false")])]),s._v(" "),n("tr",[n("td",[s._v("displayRender")]),s._v(" "),n("td",[s._v('选择后展示的渲染函数,可使用 slot="displayRender" 和 slot-scope="{labels, selectedOptions}"')]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("({labels, selectedOptions}) => vNode")])]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("labels => labels.join(' / ')")])])]),s._v(" "),n("tr",[n("td",[s._v("expandTrigger")]),s._v(" "),n("td",[s._v("次级菜单的展开方式,可选 'click' 和 'hover'")]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[s._v("'click'")])]),s._v(" "),n("tr",[n("td",[s._v("fieldNames")]),s._v(" "),n("td",[s._v("自定义 options 中 label name children 的字段")]),s._v(" "),n("td",[s._v("object")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("{ label: 'label', value: 'value', children: 'children' }")])])]),s._v(" "),n("tr",[n("td",[s._v("getPopupContainer")]),s._v(" "),n("td",[s._v("菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。")]),s._v(" "),n("td",[s._v("Function(triggerNode)")]),s._v(" "),n("td",[s._v("() => document.body")])]),s._v(" "),n("tr",[n("td",[s._v("loadData")]),s._v(" "),n("td",[s._v("用于动态加载选项,无法与 "),n("code",{pre:!0},[s._v("showSearch")]),s._v(" 一起使用")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("(selectedOptions) => void")])]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("notFoundContent")]),s._v(" "),n("td",[s._v("当下拉列表为空时显示的内容")]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[s._v("'Not Found'")])]),s._v(" "),n("tr",[n("td",[s._v("options")]),s._v(" "),n("td",[s._v("可选项数据源")]),s._v(" "),n("td",[s._v("object")]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("placeholder")]),s._v(" "),n("td",[s._v("输入框占位文本")]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[s._v("'请选择'")])]),s._v(" "),n("tr",[n("td",[s._v("popupClassName")]),s._v(" "),n("td",[s._v("自定义浮层类名")]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("popupStyle")]),s._v(" "),n("td",[s._v("自定义浮层样式")]),s._v(" "),n("td",[s._v("object")]),s._v(" "),n("td",[s._v("{}")])]),s._v(" "),n("tr",[n("td",[s._v("popupPlacement")]),s._v(" "),n("td",[s._v("浮层预设位置:"),n("code",{pre:!0},[s._v("bottomLeft")]),s._v(" "),n("code",{pre:!0},[s._v("bottomRight")]),s._v(" "),n("code",{pre:!0},[s._v("topLeft")]),s._v(" "),n("code",{pre:!0},[s._v("topRight")])]),s._v(" "),n("td",[s._v("Enum")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("bottomLeft")])])]),s._v(" "),n("tr",[n("td",[s._v("popupVisible")]),s._v(" "),n("td",[s._v("控制浮层显隐")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("showSearch")]),s._v(" "),n("td",[s._v("在选择框中显示搜索框")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("false")])]),s._v(" "),n("tr",[n("td",[s._v("size")]),s._v(" "),n("td",[s._v("输入框大小,可选 "),n("code",{pre:!0},[s._v("large")]),s._v(" "),n("code",{pre:!0},[s._v("default")]),s._v(" "),n("code",{pre:!0},[s._v("small")])]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("default")])])]),s._v(" "),n("tr",[n("td",[s._v("suffixIcon")]),s._v(" "),n("td",[s._v("自定义的选择框后缀图标")]),s._v(" "),n("td",[s._v("string | VNode | slot")]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("value(v-model)")]),s._v(" "),n("td",[s._v("指定选中项")]),s._v(" "),n("td",[s._v("string[] | number[]")]),s._v(" "),n("td",[s._v("-")])])])]),s._v(" "),n("p",[n("code",{pre:!0},[s._v("showSearch")]),s._v(" 为对象时,其中的字段:")]),s._v(" "),n("table",[n("thead",[n("tr",[n("th",[s._v("参数")]),s._v(" "),n("th",[s._v("说明")]),s._v(" "),n("th",[s._v("类型")]),s._v(" "),n("th",[s._v("默认值")])])]),s._v(" "),n("tbody",[n("tr",[n("td",[s._v("filter")]),s._v(" "),n("td",[s._v("接收 "),n("code",{pre:!0},[s._v("inputValue")]),s._v(" "),n("code",{pre:!0},[s._v("path")]),s._v(" 两个参数,当 "),n("code",{pre:!0},[s._v("path")]),s._v(" 符合筛选条件时,应返回 true,反之则返回 false。")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("function(inputValue, path): boolean")])]),s._v(" "),n("td")]),s._v(" "),n("tr",[n("td",[s._v("limit")]),s._v(" "),n("td",[s._v("搜索结果展示数量")]),s._v(" "),n("td",[s._v("number | false")]),s._v(" "),n("td",[s._v("50")])]),s._v(" "),n("tr",[n("td",[s._v("matchInputWidth")]),s._v(" "),n("td",[s._v("搜索结果列表是否与输入框同宽")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td")]),s._v(" "),n("tr",[n("td",[s._v("render")]),s._v(" "),n("td",[s._v('用于渲染 filter 后的选项,可使用 slot="showSearchRender" 和 slot-scope="{inputValue, path}"')]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("function({inputValue, path}): vNode")])]),s._v(" "),n("td")]),s._v(" "),n("tr",[n("td",[s._v("sort")]),s._v(" "),n("td",[s._v("用于排序 filter 后的选项")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("function(a, b, inputValue)")])]),s._v(" "),n("td")])])]),s._v(" "),n("h3",{attrs:{id:"事件"}},[s._v("事件 "),n("a",{staticClass:"anchor",attrs:{href:"#事件"}},[s._v("#")])]),s._v(" "),n("table",[n("thead",[n("tr",[n("th",[s._v("事件名称")]),s._v(" "),n("th",[s._v("说明")]),s._v(" "),n("th",[s._v("回调参数")])])]),s._v(" "),n("tbody",[n("tr",[n("td",[s._v("change")]),s._v(" "),n("td",[s._v("选择完成后的回调")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("(value, selectedOptions) => void")])])]),s._v(" "),n("tr",[n("td",[s._v("popupVisibleChange")]),s._v(" "),n("td",[s._v("显示/隐藏浮层的回调")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("(value) => void")])])])])]),s._v(" "),n("h2",{attrs:{id:"方法"}},[s._v("方法 "),n("a",{staticClass:"anchor",attrs:{href:"#方法"}},[s._v("#")])]),s._v(" "),n("table",[n("thead",[n("tr",[n("th",[s._v("名称")]),s._v(" "),n("th",[s._v("描述")])])]),s._v(" "),n("tbody",[n("tr",[n("td",[s._v("blur()")]),s._v(" "),n("td",[s._v("移除焦点")])]),s._v(" "),n("tr",[n("td",[s._v("focus()")]),s._v(" "),n("td",[s._v("获取焦点")])])])]),s._v(" "),n("blockquote",[n("p",[s._v("注意,如果需要获得中国省市区数据,可以参考 react 组件的实现 "),n("a",{attrs:{href:"https://gist.github.com/afc163/7582f35654fd03d5be7009444345ea17"}},[s._v("china-division")]),s._v("。")])])])}],!1,null,null,null);ns.options.__file="components/cascader/index.zh-CN.md";var ts=ns.exports,ls=function(){var s=this.$createElement;this._self._c;return this._m(0)};ls._withStripped=!0;var es=Object(e.a)({},ls,[function(){var s=this,a=s.$createElement,n=s._self._c||a;return n("div",[n("h2",{attrs:{id:"API"}},[s._v("API "),n("a",{staticClass:"anchor",attrs:{href:"#API"}},[s._v("#")])]),s._v(" "),n("pre",{pre:!0},[n("code",{pre:!0,attrs:{"v-pre":"",class:"language-html"}},[n("span",{pre:!0,attrs:{class:"hljs-tag"}},[s._v("<"),n("span",{pre:!0,attrs:{class:"hljs-name"}},[s._v("a-cascader")]),s._v(" "),n("span",{pre:!0,attrs:{class:"hljs-attr"}},[s._v(":options")]),s._v("="),n("span",{pre:!0,attrs:{class:"hljs-string"}},[s._v('"options"')]),s._v(" "),n("span",{pre:!0,attrs:{class:"hljs-attr"}},[s._v("@change")]),s._v("="),n("span",{pre:!0,attrs:{class:"hljs-string"}},[s._v('"onChange"')]),s._v(" />")]),s._v("\n")])]),s._v(" "),n("table",[n("thead",[n("tr",[n("th",[s._v("Property")]),s._v(" "),n("th",[s._v("Description")]),s._v(" "),n("th",[s._v("Type")]),s._v(" "),n("th",[s._v("Default")])])]),s._v(" "),n("tbody",[n("tr",[n("td",[s._v("allowClear")]),s._v(" "),n("td",[s._v("whether allow clear")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("true")])]),s._v(" "),n("tr",[n("td",[s._v("autoFocus")]),s._v(" "),n("td",[s._v("get focus when component mounted")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("false")])]),s._v(" "),n("tr",[n("td",[s._v("changeOnSelect")]),s._v(" "),n("td",[s._v("change value on each selection if set to true, see above demo for details")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("false")])]),s._v(" "),n("tr",[n("td",[s._v("defaultValue")]),s._v(" "),n("td",[s._v("initial selected value")]),s._v(" "),n("td",[s._v("string[] | number[]")]),s._v(" "),n("td",[s._v("[]")])]),s._v(" "),n("tr",[n("td",[s._v("disabled")]),s._v(" "),n("td",[s._v("whether disabled select")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("false")])]),s._v(" "),n("tr",[n("td",[s._v("displayRender")]),s._v(" "),n("td",[s._v('render function of displaying selected options, you can use slot="displayRender" and slot-scope="{labels, selectedOptions}"')]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("({labels, selectedOptions}) => vNode")])]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("labels => labels.join(' / ')")])])]),s._v(" "),n("tr",[n("td",[s._v("expandTrigger")]),s._v(" "),n("td",[s._v("expand current item when click or hover, one of 'click' 'hover'")]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[s._v("'click'")])]),s._v(" "),n("tr",[n("td",[s._v("fieldNames")]),s._v(" "),n("td",[s._v("custom field name for label and value and children")]),s._v(" "),n("td",[s._v("object")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("{ label: 'label', value: 'value', children: 'children' }")])])]),s._v(" "),n("tr",[n("td",[s._v("getPopupContainer")]),s._v(" "),n("td",[s._v("Parent Node which the selector should be rendered to. Default to "),n("code",{pre:!0},[s._v("body")]),s._v(". When position issues happen, try to modify it into scrollable content and position it relative.")]),s._v(" "),n("td",[s._v("Function(triggerNode)")]),s._v(" "),n("td",[s._v("() => document.body")])]),s._v(" "),n("tr",[n("td",[s._v("loadData")]),s._v(" "),n("td",[s._v("To load option lazily, and it cannot work with "),n("code",{pre:!0},[s._v("showSearch")])]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("(selectedOptions) => void")])]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("notFoundContent")]),s._v(" "),n("td",[s._v("Specify content to show when no result matches.")]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[s._v("'Not Found'")])]),s._v(" "),n("tr",[n("td",[s._v("options")]),s._v(" "),n("td",[s._v("data options of cascade")]),s._v(" "),n("td",[s._v("object")]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("placeholder")]),s._v(" "),n("td",[s._v("input placeholder")]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[s._v("'Please select'")])]),s._v(" "),n("tr",[n("td",[s._v("popupClassName")]),s._v(" "),n("td",[s._v("additional className of popup overlay")]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("popupStyle")]),s._v(" "),n("td",[s._v("additional style of popup overlay")]),s._v(" "),n("td",[s._v("object")]),s._v(" "),n("td",[s._v("{}")])]),s._v(" "),n("tr",[n("td",[s._v("popupPlacement")]),s._v(" "),n("td",[s._v("use preset popup align config from builtinPlacements:"),n("code",{pre:!0},[s._v("bottomLeft")]),s._v(" "),n("code",{pre:!0},[s._v("bottomRight")]),s._v(" "),n("code",{pre:!0},[s._v("topLeft")]),s._v(" "),n("code",{pre:!0},[s._v("topRight")])]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("bottomLeft")])])]),s._v(" "),n("tr",[n("td",[s._v("popupVisible")]),s._v(" "),n("td",[s._v("set visible of cascader popup")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("showSearch")]),s._v(" "),n("td",[s._v("Whether show search input in single mode.")]),s._v(" "),n("td",[s._v("boolean|object")]),s._v(" "),n("td",[s._v("false")])]),s._v(" "),n("tr",[n("td",[s._v("size")]),s._v(" "),n("td",[s._v("input size, one of "),n("code",{pre:!0},[s._v("large")]),s._v(" "),n("code",{pre:!0},[s._v("default")]),s._v(" "),n("code",{pre:!0},[s._v("small")])]),s._v(" "),n("td",[s._v("string")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("default")])])]),s._v(" "),n("tr",[n("td",[s._v("suffixIcon")]),s._v(" "),n("td",[s._v("The custom suffix icon")]),s._v(" "),n("td",[s._v("string | VNode | slot")]),s._v(" "),n("td",[s._v("-")])]),s._v(" "),n("tr",[n("td",[s._v("value(v-model)")]),s._v(" "),n("td",[s._v("selected value")]),s._v(" "),n("td",[s._v("string[] | number[]")]),s._v(" "),n("td",[s._v("-")])])])]),s._v(" "),n("p",[s._v("Fields in "),n("code",{pre:!0},[s._v("showSearch")]),s._v(":")]),s._v(" "),n("table",[n("thead",[n("tr",[n("th",[s._v("Property")]),s._v(" "),n("th",[s._v("Description")]),s._v(" "),n("th",[s._v("Type")]),s._v(" "),n("th",[s._v("Default")])])]),s._v(" "),n("tbody",[n("tr",[n("td",[s._v("filter")]),s._v(" "),n("td",[s._v("The function will receive two arguments, inputValue and option, if the function returns true, the option will be included in the filtered set; Otherwise, it will be excluded.")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("function(inputValue, path): boolean")])]),s._v(" "),n("td")]),s._v(" "),n("tr",[n("td",[s._v("limit")]),s._v(" "),n("td",[s._v("Set the count of filtered items")]),s._v(" "),n("td",[s._v("number | false")]),s._v(" "),n("td",[s._v("50")])]),s._v(" "),n("tr",[n("td",[s._v("matchInputWidth")]),s._v(" "),n("td",[s._v("Whether the width of result list equals to input's")]),s._v(" "),n("td",[s._v("boolean")]),s._v(" "),n("td")]),s._v(" "),n("tr",[n("td",[s._v("render")]),s._v(" "),n("td",[s._v('Used to render filtered options, you can use slot="showSearchRender" and slot-scope="{inputValue, path}"')]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("function({inputValue, path}): vNode")])]),s._v(" "),n("td")]),s._v(" "),n("tr",[n("td",[s._v("sort")]),s._v(" "),n("td",[s._v("Used to sort filtered options.")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("function(a, b, inputValue)")])]),s._v(" "),n("td")])])]),s._v(" "),n("h3",{attrs:{id:"events"}},[s._v("events "),n("a",{staticClass:"anchor",attrs:{href:"#events"}},[s._v("#")])]),s._v(" "),n("table",[n("thead",[n("tr",[n("th",[s._v("Events Name")]),s._v(" "),n("th",[s._v("Description")]),s._v(" "),n("th",[s._v("Arguments")])])]),s._v(" "),n("tbody",[n("tr",[n("td",[s._v("change")]),s._v(" "),n("td",[s._v("callback when finishing cascader select")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("(value, selectedOptions) => void")])])]),s._v(" "),n("tr",[n("td",[s._v("popupVisibleChange")]),s._v(" "),n("td",[s._v("callback when popup shown or hidden")]),s._v(" "),n("td",[n("code",{pre:!0},[s._v("(value) => void")])])])])]),s._v(" "),n("h2",{attrs:{id:"Methods"}},[s._v("Methods "),n("a",{staticClass:"anchor",attrs:{href:"#Methods"}},[s._v("#")])]),s._v(" "),n("table",[n("thead",[n("tr",[n("th",[s._v("Name")]),s._v(" "),n("th",[s._v("Description")])])]),s._v(" "),n("tbody",[n("tr",[n("td",[s._v("blur()")]),s._v(" "),n("td",[s._v("remove focus")])]),s._v(" "),n("tr",[n("td",[s._v("focus()")]),s._v(" "),n("td",[s._v("get focus")])])])])])}],!1,null,null,null);es.options.__file="components/cascader/index.en-US.md";var vs=es.exports,is="# Cascader 级联选择\n 级联选择框。\n## 何时使用\n- 需要从一组相关联的数据集合进行选择,例如省市区,公司层级,事物分类等。\n- 从一个较大的数据集合中进行选择时,用多级分类进行分隔,方便选择。\n- 比起 Select 组件,可以在同一个浮层中完成选择,有较好的体验。\n ## 代码演示",_s="# Cascader\n Cascade selection box.\n## When To Use\n- When you need to select from a set of associated data set. Such as province/city/district, company level, things classification.\n- When selecting from a large data set, with multi-stage classification separated for easy selection.\n- Chooses cascade items in one float layer for better user experience.\n## Examples\n ",cs={category:"Components",type:"Data Entry",zhType:"数据录入",title:"Cascader",subtitle:"级联选择",render:function(){var s=arguments[0];return s("div",{attrs:{id:"components-cascader-demo"}},[s("md",{attrs:{cn:is,us:_s}}),s(i),s(h),s(u),s(m),s(x),s(H),s(S),s(M),s(E),s(T),s(G),s(ss),s("api",[s(ts,{slot:"cn"}),s(vs)])])}},os=(n(1325),Object(e.a)(cs,void 0,void 0,!1,null,null,null));os.options.__file="components/cascader/demo/index.vue";a.default=os.exports}}]); |