ant-design-vue/1e652d50.async.js

1 line
76 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

(window.webpackJsonp=window.webpackJsonp||[]).push([[55],{1454:function(t,e,s){"use strict";s.r(e);var a=function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",[[s("demo-box",{attrs:{jsfiddle:{html:'\n <a-tree-select showSearch="" style="width: 300px" :value="value" :dropdownStyle="{ maxHeight: \'400px\', overflow: \'auto\' }" placeholder="Please select" allowClear="" treeDefaultExpandAll="" @change="onChange">\n <a-tree-select-node value="parent 1" title="parent 1" key="0-1">\n <a-tree-select-node value="parent 1-0" title="parent 1-0" key="0-1-1">\n <a-tree-select-node :selectable="false" value="leaf1" title="my leaf" key="random"/>\n <a-tree-select-node value="leaf2" title="your leaf" key="random1"/>\n </a-tree-select-node>\n <a-tree-select-node value="parent 1-1" title="parent 1-1" key="random2">\n <a-tree-select-node value="sss" key="random3">\n <b style="color: #08c" slot="title">sss</b>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select>\n',script:"\n export default {\n data() {\n return {\n treeExpandedKeys: [],\n value: undefined,\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n this.value = value;\n },\n },\n };\n",style:null,us:"\n#### Basic\nThe most basic usage.\n",cn:"\n#### 基本用法\n最简单的用法。\n",sourceCode:'<template>\n <a-tree-select\n showSearch\n style="width: 300px"\n :value="value"\n :dropdownStyle="{ maxHeight: \'400px\', overflow: \'auto\' }"\n placeholder="Please select"\n allowClear\n treeDefaultExpandAll\n @change="onChange"\n >\n <a-tree-select-node value="parent 1" title="parent 1" key="0-1">\n <a-tree-select-node value="parent 1-0" title="parent 1-0" key="0-1-1">\n <a-tree-select-node :selectable="false" value="leaf1" title="my leaf" key="random" />\n <a-tree-select-node value="leaf2" title="your leaf" key="random1" />\n </a-tree-select-node>\n <a-tree-select-node value="parent 1-1" title="parent 1-1" key="random2">\n <a-tree-select-node value="sss" key="random3">\n <b style="color: #08c" slot="title">sss</b>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select>\n</template>\n\n<script>\n export default {\n data() {\n return {\n treeExpandedKeys: [],\n value: undefined,\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n this.value = value;\n },\n },\n };\n<\/script>\n'}}},[s("template",{slot:"component"},[s("a-tree-select",{staticStyle:{width:"300px"},attrs:{showSearch:"",value:t.value,dropdownStyle:{maxHeight:"400px",overflow:"auto"},placeholder:"Please select",allowClear:"",treeDefaultExpandAll:""},on:{change:t.onChange}},[s("a-tree-select-node",{key:"0-1",attrs:{value:"parent 1",title:"parent 1"}},[s("a-tree-select-node",{key:"0-1-1",attrs:{value:"parent 1-0",title:"parent 1-0"}},[s("a-tree-select-node",{key:"random",attrs:{selectable:!1,value:"leaf1",title:"my leaf"}}),t._v(" "),s("a-tree-select-node",{key:"random1",attrs:{value:"leaf2",title:"your leaf"}})],1),t._v(" "),s("a-tree-select-node",{key:"random2",attrs:{value:"parent 1-1",title:"parent 1-1"}},[s("a-tree-select-node",{key:"random3",attrs:{value:"sss"}},[s("b",{staticStyle:{color:"#08c"},attrs:{slot:"title"},slot:"title"},[t._v("sss")])])],1)],1)],1)],1),t._v(" "),s("template",{slot:"description"},[s("h4",{attrs:{id:"基本用法"}},[t._v("基本用法 "),s("a",{staticClass:"anchor",attrs:{href:"#基本用法"}},[t._v("#")])]),t._v(" "),s("p",[t._v("最简单的用法。")])]),t._v(" "),s("template",{slot:"us-description"},[s("h4",{attrs:{id:"Basic"}},[t._v("Basic "),s("a",{staticClass:"anchor",attrs:{href:"#Basic"}},[t._v("#")])]),t._v(" "),s("p",[t._v("The most basic usage.")])]),t._v(" "),s("template",{slot:"code"},[s("pre",[s("code",{staticClass:"language-html"},[s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("showSearch")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"width: 300px"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"value"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":dropdownStyle")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v("\"{ maxHeight: '400px', overflow: 'auto' }\"")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"Please select"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("allowClear")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("treeDefaultExpandAll")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"onChange"')]),t._v("\n >")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"0-1"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-0"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-0"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"0-1-1"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v(":selectable")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"false"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"leaf1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"my leaf"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random"')]),t._v(" />")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"leaf2"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"your leaf"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random1"')]),t._v(" />")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random2"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"sss"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random3"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("b")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"color: #08c"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("slot")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"title"')]),t._v(">")]),t._v("sss"),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("b")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select")]),t._v(">")]),t._v("\n"),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n\n"),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),s("span",{staticClass:"javascript"},[t._v("\n "),s("span",{staticClass:"hljs-keyword"},[t._v("export")]),t._v(" "),s("span",{staticClass:"hljs-keyword"},[t._v("default")]),t._v(" {\n data() {\n "),s("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" {\n "),s("span",{staticClass:"hljs-attr"},[t._v("treeExpandedKeys")]),t._v(": [],\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-literal"},[t._v("undefined")]),t._v(",\n };\n },\n "),s("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n onChange(value) {\n "),s("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log(value);\n "),s("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".value = value;\n },\n },\n };\n")]),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),t._v("\n")])])])],2)]],2)};a._withStripped=!0;var l={data:function(){return{treeExpandedKeys:[],value:void 0}},methods:{onChange:function(t){console.log(t),this.value=t}}},n=s(31),v=Object(n.a)(l,a,[],!1,null,null,null);v.options.__file="components/tree-select/demo/basic.md";var _=v.exports,r=function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",[[s("demo-box",{attrs:{jsfiddle:{html:'\n <a-tree-select style="width: 300px" :treeData="treeData" :value="value" @change="onChange" treeCheckable="" :showCheckedStrategy="SHOW_PARENT" searchPlaceholder="Please select"/>\n',script:"\n import { TreeSelect } from 'ant-design-vue';\n const SHOW_PARENT = TreeSelect.SHOW_PARENT;\n\n const treeData = [\n {\n title: 'Node1',\n value: '0-0',\n key: '0-0',\n children: [\n {\n title: 'Child Node1',\n value: '0-0-0',\n key: '0-0-0',\n },\n ],\n },\n {\n title: 'Node2',\n value: '0-1',\n key: '0-1',\n children: [\n {\n title: 'Child Node3',\n value: '0-1-0',\n key: '0-1-0',\n disabled: true,\n },\n {\n title: 'Child Node4',\n value: '0-1-1',\n key: '0-1-1',\n },\n {\n title: 'Child Node5',\n value: '0-1-2',\n key: '0-1-2',\n },\n ],\n },\n ];\n export default {\n data() {\n return {\n value: ['0-0-0'],\n treeData,\n SHOW_PARENT,\n };\n },\n methods: {\n onChange(value) {\n console.log('onChange ', value);\n this.value = value;\n },\n },\n };\n",style:null,us:"\n#### Checkable\nMultiple and checkable.\n",cn:"\n#### 可勾选\n使用勾选框实现多选功能。\n",sourceCode:"<template>\n <a-tree-select\n style=\"width: 300px\"\n :treeData=\"treeData\"\n :value=\"value\"\n @change=\"onChange\"\n treeCheckable\n :showCheckedStrategy=\"SHOW_PARENT\"\n searchPlaceholder=\"Please select\"\n />\n</template>\n\n<script>\n import { TreeSelect } from 'ant-design-vue';\n const SHOW_PARENT = TreeSelect.SHOW_PARENT;\n\n const treeData = [\n {\n title: 'Node1',\n value: '0-0',\n key: '0-0',\n children: [\n {\n title: 'Child Node1',\n value: '0-0-0',\n key: '0-0-0',\n },\n ],\n },\n {\n title: 'Node2',\n value: '0-1',\n key: '0-1',\n children: [\n {\n title: 'Child Node3',\n value: '0-1-0',\n key: '0-1-0',\n disabled: true,\n },\n {\n title: 'Child Node4',\n value: '0-1-1',\n key: '0-1-1',\n },\n {\n title: 'Child Node5',\n value: '0-1-2',\n key: '0-1-2',\n },\n ],\n },\n ];\n export default {\n data() {\n return {\n value: ['0-0-0'],\n treeData,\n SHOW_PARENT,\n };\n },\n methods: {\n onChange(value) {\n console.log('onChange ', value);\n this.value = value;\n },\n },\n };\n<\/script>\n"}}},[s("template",{slot:"component"},[s("a-tree-select",{staticStyle:{width:"300px"},attrs:{treeData:t.treeData,value:t.value,treeCheckable:"",showCheckedStrategy:t.SHOW_PARENT,searchPlaceholder:"Please select"},on:{change:t.onChange}})],1),t._v(" "),s("template",{slot:"description"},[s("h4",{attrs:{id:"可勾选"}},[t._v("可勾选 "),s("a",{staticClass:"anchor",attrs:{href:"#可勾选"}},[t._v("#")])]),t._v(" "),s("p",[t._v("使用勾选框实现多选功能。")])]),t._v(" "),s("template",{slot:"us-description"},[s("h4",{attrs:{id:"Checkable"}},[t._v("Checkable "),s("a",{staticClass:"anchor",attrs:{href:"#Checkable"}},[t._v("#")])]),t._v(" "),s("p",[t._v("Multiple and checkable.")])]),t._v(" "),s("template",{slot:"code"},[s("pre",[s("code",{staticClass:"language-html"},[s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"width: 300px"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":treeData")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"treeData"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"value"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"onChange"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("treeCheckable")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":showCheckedStrategy")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"SHOW_PARENT"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("searchPlaceholder")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"Please select"')]),t._v("\n />")]),t._v("\n"),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n\n"),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),s("span",{staticClass:"javascript"},[t._v("\n "),s("span",{staticClass:"hljs-keyword"},[t._v("import")]),t._v(" { TreeSelect } "),s("span",{staticClass:"hljs-keyword"},[t._v("from")]),t._v(" "),s("span",{staticClass:"hljs-string"},[t._v("'ant-design-vue'")]),t._v(";\n "),s("span",{staticClass:"hljs-keyword"},[t._v("const")]),t._v(" SHOW_PARENT = TreeSelect.SHOW_PARENT;\n\n "),s("span",{staticClass:"hljs-keyword"},[t._v("const")]),t._v(" treeData = [\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'Node1'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("children")]),t._v(": [\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'Child Node1'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0-0'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0-0'")]),t._v(",\n },\n ],\n },\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'Node2'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("children")]),t._v(": [\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'Child Node3'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1-0'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1-0'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("disabled")]),t._v(": "),s("span",{staticClass:"hljs-literal"},[t._v("true")]),t._v(",\n },\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'Child Node4'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1-1'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1-1'")]),t._v(",\n },\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'Child Node5'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1-2'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1-2'")]),t._v(",\n },\n ],\n },\n ];\n "),s("span",{staticClass:"hljs-keyword"},[t._v("export")]),t._v(" "),s("span",{staticClass:"hljs-keyword"},[t._v("default")]),t._v(" {\n data() {\n "),s("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" {\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": ["),s("span",{staticClass:"hljs-string"},[t._v("'0-0-0'")]),t._v("],\n treeData,\n SHOW_PARENT,\n };\n },\n "),s("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n onChange(value) {\n "),s("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log("),s("span",{staticClass:"hljs-string"},[t._v("'onChange '")]),t._v(", value);\n "),s("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".value = value;\n },\n },\n };\n")]),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),t._v("\n")])])])],2)]],2)};r._withStripped=!0;var i=s(1192).a.SHOW_PARENT,o=[{title:"Node1",value:"0-0",key:"0-0",children:[{title:"Child Node1",value:"0-0-0",key:"0-0-0"}]},{title:"Node2",value:"0-1",key:"0-1",children:[{title:"Child Node3",value:"0-1-0",key:"0-1-0",disabled:!0},{title:"Child Node4",value:"0-1-1",key:"0-1-1"},{title:"Child Node5",value:"0-1-2",key:"0-1-2"}]}],c={data:function(){return{value:["0-0-0"],treeData:o,SHOW_PARENT:i}},methods:{onChange:function(t){console.log("onChange ",t),this.value=t}}},d=Object(n.a)(c,r,[],!1,null,null,null);d.options.__file="components/tree-select/demo/checkable.md";var p=d.exports,h=function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",[[s("demo-box",{attrs:{jsfiddle:{html:'\n <a-tree-select showSearch="" style="width: 300px" :value="value" :dropdownStyle="{ maxHeight: \'400px\', overflow: \'auto\' }" placeholder="Please select" allowClear="" multiple="" treeDefaultExpandAll="" @change="onChange" @search="onSearch" @select="onSelect">\n <a-tree-select-node value="parent 1" title="parent 1" key="0-1">\n <a-tree-select-node value="parent 1-0" title="parent 1-0" key="0-1-1">\n <a-tree-select-node value="leaf1" title="my leaf" key="random"/>\n <a-tree-select-node value="leaf2" title="your leaf" key="random1"/>\n </a-tree-select-node>\n <a-tree-select-node value="parent 1-1" title="parent 1-1" key="random2">\n <a-tree-select-node value="sss" key="random3">\n <b style="color: #08c" slot="title">sss</b>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select>\n',script:"\n export default {\n data() {\n return {\n value: undefined,\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n this.value = value;\n },\n onSearch() {\n console.log(...arguments);\n },\n onSelect() {\n console.log(...arguments);\n },\n },\n };\n",style:null,us:"\n#### Multiple Selection\nMultiple selection usage.\n",cn:"\n#### 多选\n多选的树选择。\n",sourceCode:'<template>\n <a-tree-select\n showSearch\n style="width: 300px"\n :value="value"\n :dropdownStyle="{ maxHeight: \'400px\', overflow: \'auto\' }"\n placeholder="Please select"\n allowClear\n multiple\n treeDefaultExpandAll\n @change="onChange"\n @search="onSearch"\n @select="onSelect"\n >\n <a-tree-select-node value="parent 1" title="parent 1" key="0-1">\n <a-tree-select-node value="parent 1-0" title="parent 1-0" key="0-1-1">\n <a-tree-select-node value="leaf1" title="my leaf" key="random" />\n <a-tree-select-node value="leaf2" title="your leaf" key="random1" />\n </a-tree-select-node>\n <a-tree-select-node value="parent 1-1" title="parent 1-1" key="random2">\n <a-tree-select-node value="sss" key="random3">\n <b style="color: #08c" slot="title">sss</b>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select>\n</template>\n\n<script>\n export default {\n data() {\n return {\n value: undefined,\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n this.value = value;\n },\n onSearch() {\n console.log(...arguments);\n },\n onSelect() {\n console.log(...arguments);\n },\n },\n };\n<\/script>\n'}}},[s("template",{slot:"component"},[s("a-tree-select",{staticStyle:{width:"300px"},attrs:{showSearch:"",value:t.value,dropdownStyle:{maxHeight:"400px",overflow:"auto"},placeholder:"Please select",allowClear:"",multiple:"",treeDefaultExpandAll:""},on:{change:t.onChange,search:t.onSearch,select:t.onSelect}},[s("a-tree-select-node",{key:"0-1",attrs:{value:"parent 1",title:"parent 1"}},[s("a-tree-select-node",{key:"0-1-1",attrs:{value:"parent 1-0",title:"parent 1-0"}},[s("a-tree-select-node",{key:"random",attrs:{value:"leaf1",title:"my leaf"}}),t._v(" "),s("a-tree-select-node",{key:"random1",attrs:{value:"leaf2",title:"your leaf"}})],1),t._v(" "),s("a-tree-select-node",{key:"random2",attrs:{value:"parent 1-1",title:"parent 1-1"}},[s("a-tree-select-node",{key:"random3",attrs:{value:"sss"}},[s("b",{staticStyle:{color:"#08c"},attrs:{slot:"title"},slot:"title"},[t._v("sss")])])],1)],1)],1)],1),t._v(" "),s("template",{slot:"description"},[s("h4",{attrs:{id:"多选"}},[t._v("多选 "),s("a",{staticClass:"anchor",attrs:{href:"#多选"}},[t._v("#")])]),t._v(" "),s("p",[t._v("多选的树选择。")])]),t._v(" "),s("template",{slot:"us-description"},[s("h4",{attrs:{id:"Multiple-Selection"}},[t._v("Multiple Selection "),s("a",{staticClass:"anchor",attrs:{href:"#Multiple-Selection"}},[t._v("#")])]),t._v(" "),s("p",[t._v("Multiple selection usage.")])]),t._v(" "),s("template",{slot:"code"},[s("pre",[s("code",{staticClass:"language-html"},[s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("showSearch")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"width: 300px"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"value"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":dropdownStyle")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v("\"{ maxHeight: '400px', overflow: 'auto' }\"")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"Please select"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("allowClear")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("multiple")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("treeDefaultExpandAll")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"onChange"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("@search")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"onSearch"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("@select")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"onSelect"')]),t._v("\n >")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"0-1"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-0"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-0"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"0-1-1"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"leaf1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"my leaf"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random"')]),t._v(" />")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"leaf2"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"your leaf"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random1"')]),t._v(" />")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random2"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"sss"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random3"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("b")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"color: #08c"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("slot")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"title"')]),t._v(">")]),t._v("sss"),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("b")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select")]),t._v(">")]),t._v("\n"),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n\n"),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),s("span",{staticClass:"javascript"},[t._v("\n "),s("span",{staticClass:"hljs-keyword"},[t._v("export")]),t._v(" "),s("span",{staticClass:"hljs-keyword"},[t._v("default")]),t._v(" {\n data() {\n "),s("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" {\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-literal"},[t._v("undefined")]),t._v(",\n };\n },\n "),s("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n onChange(value) {\n "),s("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log(value);\n "),s("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".value = value;\n },\n onSearch() {\n "),s("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log(...arguments);\n },\n onSelect() {\n "),s("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log(...arguments);\n },\n },\n };\n")]),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),t._v("\n")])])])],2)]],2)};h._withStripped=!0;var u={data:function(){return{value:void 0}},methods:{onChange:function(t){console.log(t),this.value=t},onSearch:function(){var t;(t=console).log.apply(t,arguments)},onSelect:function(){var t;(t=console).log.apply(t,arguments)}}},C=Object(n.a)(u,h,[],!1,null,null,null);C.options.__file="components/tree-select/demo/multiple.md";var j=C.exports,g=function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",[[s("demo-box",{attrs:{jsfiddle:{html:'\n <a-tree-select style="width: 300px" :dropdownStyle="{ maxHeight: \'400px\', overflow: \'auto\' }" :treeData="treeData" placeholder="Please select" treeDefaultExpandAll="" v-model="value">\n <span style="color: #08c" slot="title" slot-scope="{key, value}" v-if="key=\'0-0-1\'">\n Child Node1 {{value}}\n </span>\n </a-tree-select>\n',script:"\n const treeData = [\n {\n title: 'Node1',\n value: '0-0',\n key: '0-0',\n children: [\n {\n value: '0-0-1',\n key: '0-0-1',\n scopedSlots: {\n // custom title\n title: 'title',\n },\n },\n {\n title: 'Child Node2',\n value: '0-0-2',\n key: '0-0-2',\n },\n ],\n },\n {\n title: 'Node2',\n value: '0-1',\n key: '0-1',\n },\n ];\n export default {\n data() {\n return {\n value: undefined,\n treeData,\n };\n },\n watch: {\n value(value) {\n console.log(value);\n },\n },\n };\n",style:null,us:"\n#### Generate form tree data\nThe tree structure can be populated using `treeData` property. This is a quick and easy way to provide the tree content.\n",cn:"\n#### 从数据直接生成\n使用 `treeData` 把 JSON 数据直接生成树结构。\n",sourceCode:"<template>\n <a-tree-select\n style=\"width: 300px\"\n :dropdownStyle=\"{ maxHeight: '400px', overflow: 'auto' }\"\n :treeData=\"treeData\"\n placeholder=\"Please select\"\n treeDefaultExpandAll\n v-model=\"value\"\n >\n <span style=\"color: #08c\" slot=\"title\" slot-scope=\"{key, value}\" v-if=\"key='0-0-1'\">\n Child Node1 {{value}}\n </span>\n </a-tree-select>\n</template>\n\n<script>\n const treeData = [\n {\n title: 'Node1',\n value: '0-0',\n key: '0-0',\n children: [\n {\n value: '0-0-1',\n key: '0-0-1',\n scopedSlots: {\n // custom title\n title: 'title',\n },\n },\n {\n title: 'Child Node2',\n value: '0-0-2',\n key: '0-0-2',\n },\n ],\n },\n {\n title: 'Node2',\n value: '0-1',\n key: '0-1',\n },\n ];\n export default {\n data() {\n return {\n value: undefined,\n treeData,\n };\n },\n watch: {\n value(value) {\n console.log(value);\n },\n },\n };\n<\/script>\n"}}},[s("template",{slot:"component"},[s("a-tree-select",{staticStyle:{width:"300px"},attrs:{dropdownStyle:{maxHeight:"400px",overflow:"auto"},treeData:t.treeData,placeholder:"Please select",treeDefaultExpandAll:""},scopedSlots:t._u([{key:"title",fn:function(e){e.key;var a=e.value;return"0-0-1"?s("span",{staticStyle:{color:"#08c"}},[t._v("\n Child Node1 "+t._s(a)+"\n ")]):t._e()}}],null,!0),model:{value:t.value,callback:function(e){t.value=e},expression:"value"}})],1),t._v(" "),s("template",{slot:"description"},[s("h4",{attrs:{id:"从数据直接生成"}},[t._v("从数据直接生成 "),s("a",{staticClass:"anchor",attrs:{href:"#从数据直接生成"}},[t._v("#")])]),t._v(" "),s("p",[t._v("使用 "),s("code",[t._v("treeData")]),t._v(" 把 JSON 数据直接生成树结构。")])]),t._v(" "),s("template",{slot:"us-description"},[s("h4",{attrs:{id:"Generate-form-tree-data"}},[t._v("Generate form tree data "),s("a",{staticClass:"anchor",attrs:{href:"#Generate-form-tree-data"}},[t._v("#")])]),t._v(" "),s("p",[t._v("The tree structure can be populated using "),s("code",[t._v("treeData")]),t._v(" property. This is a quick and easy way to provide the tree content.")])]),t._v(" "),s("template",{slot:"code"},[s("pre",[s("code",{staticClass:"language-html"},[s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"width: 300px"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":dropdownStyle")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v("\"{ maxHeight: '400px', overflow: 'auto' }\"")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":treeData")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"treeData"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"Please select"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("treeDefaultExpandAll")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("v-model")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"value"')]),t._v("\n >")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("span")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"color: #08c"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("slot")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"title"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("slot-scope")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"{key, value}"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("v-if")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v("\"key='0-0-1'\"")]),t._v(">")]),t._v("\n Child Node1 "),s("span",[t._v("{{")]),t._v("value"),s("span",[t._v("}}")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("span")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select")]),t._v(">")]),t._v("\n"),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n\n"),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),s("span",{staticClass:"javascript"},[t._v("\n "),s("span",{staticClass:"hljs-keyword"},[t._v("const")]),t._v(" treeData = [\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'Node1'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("children")]),t._v(": [\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0-1'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0-1'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("scopedSlots")]),t._v(": {\n "),s("span",{staticClass:"hljs-comment"},[t._v("// custom title")]),t._v("\n title: "),s("span",{staticClass:"hljs-string"},[t._v("'title'")]),t._v(",\n },\n },\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'Child Node2'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0-2'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-0-2'")]),t._v(",\n },\n ],\n },\n {\n "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'Node2'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1'")]),t._v(",\n "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v(": "),s("span",{staticClass:"hljs-string"},[t._v("'0-1'")]),t._v(",\n },\n ];\n "),s("span",{staticClass:"hljs-keyword"},[t._v("export")]),t._v(" "),s("span",{staticClass:"hljs-keyword"},[t._v("default")]),t._v(" {\n data() {\n "),s("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" {\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-literal"},[t._v("undefined")]),t._v(",\n treeData,\n };\n },\n "),s("span",{staticClass:"hljs-attr"},[t._v("watch")]),t._v(": {\n value(value) {\n "),s("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log(value);\n },\n },\n };\n")]),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),t._v("\n")])])])],2)]],2)};g._withStripped=!0;var m=[{title:"Node1",value:"0-0",key:"0-0",children:[{value:"0-0-1",key:"0-0-1",scopedSlots:{title:"title"}},{title:"Child Node2",value:"0-0-2",key:"0-0-2"}]},{title:"Node2",value:"0-1",key:"0-1"}],f={data:function(){return{value:void 0,treeData:m}},watch:{value:function(t){console.log(t)}}},y=Object(n.a)(f,g,[],!1,null,null,null);y.options.__file="components/tree-select/demo/treeData.md";var b=y.exports,k=function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",[[s("demo-box",{attrs:{jsfiddle:{html:'\n <a-tree-select showSearch="" style="width: 300px" :value="value" :dropdownStyle="{ maxHeight: \'400px\', overflow: \'auto\' }" placeholder="Please select" allowClear="" treeDefaultExpandAll="" @change="onChange">\n <a-icon slot="suffixIcon" type="smile"/>\n <a-tree-select-node value="parent 1" title="parent 1" key="0-1">\n <a-tree-select-node value="parent 1-0" title="parent 1-0" key="0-1-1">\n <a-tree-select-node value="leaf1" title="my leaf" key="random"/>\n <a-tree-select-node value="leaf2" title="your leaf" key="random1"/>\n </a-tree-select-node>\n <a-tree-select-node value="parent 1-1" title="parent 1-1" key="random2">\n <a-tree-select-node value="sss" key="random3">\n <b style="color: #08c" slot="title">sss</b>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select>\n',script:"\n export default {\n data() {\n return {\n value: undefined,\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n this.value = value;\n },\n },\n };\n",style:null,us:"\n#### Suffix\nThe most basic usage.\n",cn:"\n#### 后缀图标\n最简单的用法。\n",sourceCode:'<template>\n <a-tree-select\n showSearch\n style="width: 300px"\n :value="value"\n :dropdownStyle="{ maxHeight: \'400px\', overflow: \'auto\' }"\n placeholder="Please select"\n allowClear\n treeDefaultExpandAll\n @change="onChange"\n >\n <a-icon slot="suffixIcon" type="smile" />\n <a-tree-select-node value="parent 1" title="parent 1" key="0-1">\n <a-tree-select-node value="parent 1-0" title="parent 1-0" key="0-1-1">\n <a-tree-select-node value="leaf1" title="my leaf" key="random" />\n <a-tree-select-node value="leaf2" title="your leaf" key="random1" />\n </a-tree-select-node>\n <a-tree-select-node value="parent 1-1" title="parent 1-1" key="random2">\n <a-tree-select-node value="sss" key="random3">\n <b style="color: #08c" slot="title">sss</b>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select-node>\n </a-tree-select>\n</template>\n\n<script>\n export default {\n data() {\n return {\n value: undefined,\n };\n },\n methods: {\n onChange(value) {\n console.log(value);\n this.value = value;\n },\n },\n };\n<\/script>\n'}}},[s("template",{slot:"component"},[s("a-tree-select",{staticStyle:{width:"300px"},attrs:{showSearch:"",value:t.value,dropdownStyle:{maxHeight:"400px",overflow:"auto"},placeholder:"Please select",allowClear:"",treeDefaultExpandAll:""},on:{change:t.onChange}},[s("a-icon",{attrs:{slot:"suffixIcon",type:"smile"},slot:"suffixIcon"}),t._v(" "),s("a-tree-select-node",{key:"0-1",attrs:{value:"parent 1",title:"parent 1"}},[s("a-tree-select-node",{key:"0-1-1",attrs:{value:"parent 1-0",title:"parent 1-0"}},[s("a-tree-select-node",{key:"random",attrs:{value:"leaf1",title:"my leaf"}}),t._v(" "),s("a-tree-select-node",{key:"random1",attrs:{value:"leaf2",title:"your leaf"}})],1),t._v(" "),s("a-tree-select-node",{key:"random2",attrs:{value:"parent 1-1",title:"parent 1-1"}},[s("a-tree-select-node",{key:"random3",attrs:{value:"sss"}},[s("b",{staticStyle:{color:"#08c"},attrs:{slot:"title"},slot:"title"},[t._v("sss")])])],1)],1)],1)],1),t._v(" "),s("template",{slot:"description"},[s("h4",{attrs:{id:"后缀图标"}},[t._v("后缀图标 "),s("a",{staticClass:"anchor",attrs:{href:"#后缀图标"}},[t._v("#")])]),t._v(" "),s("p",[t._v("最简单的用法。")])]),t._v(" "),s("template",{slot:"us-description"},[s("h4",{attrs:{id:"Suffix"}},[t._v("Suffix "),s("a",{staticClass:"anchor",attrs:{href:"#Suffix"}},[t._v("#")])]),t._v(" "),s("p",[t._v("The most basic usage.")])]),t._v(" "),s("template",{slot:"code"},[s("pre",[s("code",{staticClass:"language-html"},[s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("showSearch")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"width: 300px"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"value"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v(":dropdownStyle")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v("\"{ maxHeight: '400px', overflow: 'auto' }\"")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("placeholder")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"Please select"')]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("allowClear")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("treeDefaultExpandAll")]),t._v("\n "),s("span",{staticClass:"hljs-attr"},[t._v("@change")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"onChange"')]),t._v("\n >")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-icon")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("slot")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"suffixIcon"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("type")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"smile"')]),t._v(" />")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"0-1"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-0"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-0"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"0-1-1"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"leaf1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"my leaf"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random"')]),t._v(" />")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"leaf2"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"your leaf"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random1"')]),t._v(" />")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("title")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"parent 1-1"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random2"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"sss"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("key")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"random3"')]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("b")]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("style")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"color: #08c"')]),t._v(" "),s("span",{staticClass:"hljs-attr"},[t._v("slot")]),t._v("="),s("span",{staticClass:"hljs-string"},[t._v('"title"')]),t._v(">")]),t._v("sss"),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("b")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select-node")]),t._v(">")]),t._v("\n "),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("a-tree-select")]),t._v(">")]),t._v("\n"),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("template")]),t._v(">")]),t._v("\n\n"),s("span",{staticClass:"hljs-tag"},[t._v("<"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),s("span",{staticClass:"javascript"},[t._v("\n "),s("span",{staticClass:"hljs-keyword"},[t._v("export")]),t._v(" "),s("span",{staticClass:"hljs-keyword"},[t._v("default")]),t._v(" {\n data() {\n "),s("span",{staticClass:"hljs-keyword"},[t._v("return")]),t._v(" {\n "),s("span",{staticClass:"hljs-attr"},[t._v("value")]),t._v(": "),s("span",{staticClass:"hljs-literal"},[t._v("undefined")]),t._v(",\n };\n },\n "),s("span",{staticClass:"hljs-attr"},[t._v("methods")]),t._v(": {\n onChange(value) {\n "),s("span",{staticClass:"hljs-built_in"},[t._v("console")]),t._v(".log(value);\n "),s("span",{staticClass:"hljs-keyword"},[t._v("this")]),t._v(".value = value;\n },\n },\n };\n")]),s("span",{staticClass:"hljs-tag"},[t._v("</"),s("span",{staticClass:"hljs-name"},[t._v("script")]),t._v(">")]),t._v("\n")])])])],2)]],2)};k._withStripped=!0;var w={data:function(){return{value:void 0}},methods:{onChange:function(t){console.log(t),this.value=t}}},x=Object(n.a)(w,k,[],!1,null,null,null);x.options.__file="components/tree-select/demo/suffix.md";var S=x.exports,N=function(){var t=this.$createElement;this._self._c;return this._m(0)};N._withStripped=!0;var T=Object(n.a)({},N,[function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",[s("h2",{attrs:{id:"API"}},[t._v("API "),s("a",{staticClass:"anchor",attrs:{href:"#API"}},[t._v("#")])]),t._v(" "),s("h3",{attrs:{id:"Tree-props"}},[t._v("Tree props "),s("a",{staticClass:"anchor",attrs:{href:"#Tree-props"}},[t._v("#")])]),t._v(" "),s("table",[s("thead",[s("tr",[s("th",[t._v("参数")]),t._v(" "),s("th",[t._v("说明")]),t._v(" "),s("th",[t._v("类型")]),t._v(" "),s("th",[t._v("默认值")])])]),t._v(" "),s("tbody",[s("tr",[s("td",[t._v("allowClear")]),t._v(" "),s("td",[t._v("显示清除按钮")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("defaultValue")]),t._v(" "),s("td",[t._v("指定默认选中的条目")]),t._v(" "),s("td",[t._v("string/string[]")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("disabled")]),t._v(" "),s("td",[t._v("是否禁用")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("dropdownClassName")]),t._v(" "),s("td",[t._v("下拉菜单的 className 属性")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("dropdownMatchSelectWidth")]),t._v(" "),s("td",[t._v("下拉菜单和选择器同宽")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("true")])]),t._v(" "),s("tr",[s("td",[t._v("dropdownStyle")]),t._v(" "),s("td",[t._v("下拉菜单的样式")]),t._v(" "),s("td",[t._v("object")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("filterTreeNode")]),t._v(" "),s("td",[t._v("是否根据输入项进行筛选,默认用 treeNodeFilterProp 的值作为要筛选的 TreeNode 的属性值")]),t._v(" "),s("td",[t._v("boolean|Function(inputValue: string, treeNode: TreeNode) (函数需要返回 bool 值)")]),t._v(" "),s("td",[t._v("Function")])]),t._v(" "),s("tr",[s("td",[t._v("getPopupContainer")]),t._v(" "),s("td",[t._v("菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。")]),t._v(" "),s("td",[t._v("Function(triggerNode)")]),t._v(" "),s("td",[t._v("() => document.body")])]),t._v(" "),s("tr",[s("td",[t._v("labelInValue")]),t._v(" "),s("td",[t._v("是否把每个选项的 label 包装到 value 中,会把 value 类型从 "),s("code",{pre:!0},[t._v("string")]),t._v(" 变为 "),s("code",{pre:!0},[t._v("{value: string, label: VNode, halfChecked(treeCheckStrictly 时有效): string[] }")]),t._v(" 的格式")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("loadData")]),t._v(" "),s("td",[t._v("异步加载数据")]),t._v(" "),s("td",[t._v("function(node)")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("maxTagCount")]),t._v(" "),s("td",[t._v("最多显示多少个 tag")]),t._v(" "),s("td",[t._v("number")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("maxTagPlaceholder")]),t._v(" "),s("td",[t._v("隐藏 tag 时显示的内容")]),t._v(" "),s("td",[t._v("slot/function(omittedValues)")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("multiple")]),t._v(" "),s("td",[t._v("支持多选(当设置 treeCheckable 时自动变为 true")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("placeholder")]),t._v(" "),s("td",[t._v("选择框默认文字")]),t._v(" "),s("td",[t._v("string|slot")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("searchPlaceholder")]),t._v(" "),s("td",[t._v("搜索框默认文字")]),t._v(" "),s("td",[t._v("string|slot")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("searchValue(.sync)")]),t._v(" "),s("td",[t._v("搜索框的值,可以通过 "),s("code",{pre:!0},[t._v("search")]),t._v(" 事件获取用户输入")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("treeIcon")]),t._v(" "),s("td",[t._v("是否展示 TreeNode title 前的图标,没有默认样式,如设置为 true需要自行定义图标相关样式")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("showCheckedStrategy")]),t._v(" "),s("td",[t._v("定义选中项回填的方式。"),s("code",{pre:!0},[t._v("TreeSelect.SHOW_ALL")]),t._v(": 显示所有选中节点(包括父节点). "),s("code",{pre:!0},[t._v("TreeSelect.SHOW_PARENT")]),t._v(": 只显示父节点(当父节点下所有子节点都选中时). 默认只显示子节点.")]),t._v(" "),s("td",[t._v("enum{TreeSelect.SHOW_ALL, TreeSelect.SHOW_PARENT, TreeSelect.SHOW_CHILD }")]),t._v(" "),s("td",[t._v("TreeSelect.SHOW_CHILD")])]),t._v(" "),s("tr",[s("td",[t._v("showSearch")]),t._v(" "),s("td",[t._v("在下拉中显示搜索框(仅在单选模式下生效)")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("size")]),t._v(" "),s("td",[t._v("选择框大小,可选 "),s("code",{pre:!0},[t._v("large")]),t._v(" "),s("code",{pre:!0},[t._v("small")])]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("'default'")])]),t._v(" "),s("tr",[s("td",[t._v("suffixIcon")]),t._v(" "),s("td",[t._v("自定义的选择框后缀图标")]),t._v(" "),s("td",[t._v("VNode | slot")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("treeCheckable")]),t._v(" "),s("td",[t._v("显示 checkbox")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("treeCheckStrictly")]),t._v(" "),s("td",[t._v("checkable 状态下节点选择完全受控(父子节点选中状态不再关联),会使得 "),s("code",{pre:!0},[t._v("labelInValue")]),t._v(" 强制为 true")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("treeData")]),t._v(" "),s("td",[t._v("treeNodes 数据,如果设置则不需要手动构造 TreeNode 节点value 在整个树范围内唯一)")]),t._v(" "),s("td",[t._v("array<{value, label, children, [disabled, disableCheckbox, selectable]}>")]),t._v(" "),s("td",[t._v("[]")])]),t._v(" "),s("tr",[s("td",[t._v("treeDataSimpleMode")]),t._v(" "),s("td",[t._v("使用简单格式的 treeData具体设置参考可设置的类型 (此时 treeData 应变为这样的数据结构: [{id:1, pId:0, value:'1', label:\"test1\",...},...], "),s("code",{pre:!0},[t._v("pId")]),t._v(" 是父节点的 id)")]),t._v(" "),s("td",[t._v("false|Array<{ id: string, pId: string, rootPId: null }>")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("treeDefaultExpandAll")]),t._v(" "),s("td",[t._v("默认展开所有树节点")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("treeDefaultExpandedKeys")]),t._v(" "),s("td",[t._v("默认展开的树节点")]),t._v(" "),s("td",[t._v("string[] | number[]")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("treeExpandedKeys(.sync)")]),t._v(" "),s("td",[t._v("设置展开的树节点")]),t._v(" "),s("td",[t._v("string[] | number[]")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("treeNodeFilterProp")]),t._v(" "),s("td",[t._v("输入项过滤对应的 treeNode 属性")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("'value'")])]),t._v(" "),s("tr",[s("td",[t._v("treeNodeLabelProp")]),t._v(" "),s("td",[t._v("作为显示的 prop 设置")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("'title'")])]),t._v(" "),s("tr",[s("td",[t._v("value(v-model)")]),t._v(" "),s("td",[t._v("指定当前选中的条目")]),t._v(" "),s("td",[t._v("string/string[]")]),t._v(" "),s("td",[t._v("-")])])])]),t._v(" "),s("h3",{attrs:{id:"事件"}},[t._v("事件 "),s("a",{staticClass:"anchor",attrs:{href:"#事件"}},[t._v("#")])]),t._v(" "),s("table",[s("thead",[s("tr",[s("th",[t._v("事件名称")]),t._v(" "),s("th",[t._v("说明")]),t._v(" "),s("th",[t._v("回调参数")])])]),t._v(" "),s("tbody",[s("tr",[s("td",[t._v("change")]),t._v(" "),s("td",[t._v("选中树节点时调用此函数")]),t._v(" "),s("td",[t._v("function(value, label, extra)")])]),t._v(" "),s("tr",[s("td",[t._v("search")]),t._v(" "),s("td",[t._v("文本框值变化时回调")]),t._v(" "),s("td",[t._v("function(value: string)")])]),t._v(" "),s("tr",[s("td",[t._v("select")]),t._v(" "),s("td",[t._v("被选中时调用")]),t._v(" "),s("td",[t._v("function(value, node, extra)")])]),t._v(" "),s("tr",[s("td",[t._v("treeExpand")]),t._v(" "),s("td",[t._v("展开节点时调用")]),t._v(" "),s("td",[t._v("function(expandedKeys)")])])])]),t._v(" "),s("h3",{attrs:{id:"Tree-方法"}},[t._v("Tree 方法 "),s("a",{staticClass:"anchor",attrs:{href:"#Tree-方法"}},[t._v("#")])]),t._v(" "),s("table",[s("thead",[s("tr",[s("th",[t._v("名称")]),t._v(" "),s("th",[t._v("描述")])])]),t._v(" "),s("tbody",[s("tr",[s("td",[t._v("blur()")]),t._v(" "),s("td",[t._v("移除焦点")])]),t._v(" "),s("tr",[s("td",[t._v("focus()")]),t._v(" "),s("td",[t._v("获取焦点")])])])]),t._v(" "),s("h3",{attrs:{id:"TreeNode-props"}},[t._v("TreeNode props "),s("a",{staticClass:"anchor",attrs:{href:"#TreeNode-props"}},[t._v("#")])]),t._v(" "),s("blockquote",[s("p",[t._v("建议使用 treeData 来代替 TreeNode免去手工构造麻烦")])]),t._v(" "),s("table",[s("thead",[s("tr",[s("th",[t._v("参数")]),t._v(" "),s("th",[t._v("说明")]),t._v(" "),s("th",[t._v("类型")]),t._v(" "),s("th",[t._v("默认值")])])]),t._v(" "),s("tbody",[s("tr",[s("td",[t._v("selectable")]),t._v(" "),s("td",[t._v("是否可选")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("true")])]),t._v(" "),s("tr",[s("td",[t._v("disableCheckbox")]),t._v(" "),s("td",[t._v("禁掉 checkbox")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("disabled")]),t._v(" "),s("td",[t._v("是否禁用")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("isLeaf")]),t._v(" "),s("td",[t._v("是否是叶子节点")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("key")]),t._v(" "),s("td",[t._v("此项必须设置(其值在整个树范围内唯一)")]),t._v(" "),s("td",[t._v("string | number")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("title")]),t._v(" "),s("td",[t._v("树节点显示的内容")]),t._v(" "),s("td",[t._v("string|slot")]),t._v(" "),s("td",[t._v("'---'")])]),t._v(" "),s("tr",[s("td",[t._v("value")]),t._v(" "),s("td",[t._v("默认根据此属性值进行筛选(其值在整个树范围内唯一)")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("scopedSlots")]),t._v(" "),s("td",[t._v("使用 treeData 时,可以通过该属性配置支持 slot 的属性,如 "),s("code",{pre:!0},[t._v("scopedSlots: { title: 'XXX'}")])]),t._v(" "),s("td",[t._v("object")]),t._v(" "),s("td",[t._v("-")])])])])])}],!1,null,null,null);T.options.__file="components/tree-select/index.zh-CN.md";var D=T.exports,P=function(){var t=this.$createElement;this._self._c;return this._m(0)};P._withStripped=!0;var E=Object(n.a)({},P,[function(){var t=this,e=t.$createElement,s=t._self._c||e;return s("div",[s("h2",{attrs:{id:"API"}},[t._v("API "),s("a",{staticClass:"anchor",attrs:{href:"#API"}},[t._v("#")])]),t._v(" "),s("h3",{attrs:{id:"Tree-props"}},[t._v("Tree props "),s("a",{staticClass:"anchor",attrs:{href:"#Tree-props"}},[t._v("#")])]),t._v(" "),s("table",[s("thead",[s("tr",[s("th",[t._v("Property")]),t._v(" "),s("th",[t._v("Description")]),t._v(" "),s("th",[t._v("Type")]),t._v(" "),s("th",[t._v("Default")])])]),t._v(" "),s("tbody",[s("tr",[s("td",[t._v("allowClear")]),t._v(" "),s("td",[t._v("Whether allow clear")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("defaultValue")]),t._v(" "),s("td",[t._v("To set the initial selected treeNode(s).")]),t._v(" "),s("td",[t._v("string|string[]")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("disabled")]),t._v(" "),s("td",[t._v("Disabled or not")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("dropdownClassName")]),t._v(" "),s("td",[t._v("className of dropdown menu")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("dropdownMatchSelectWidth")]),t._v(" "),s("td",[t._v("Determine whether the dropdown menu and the select input are the same width")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("true")])]),t._v(" "),s("tr",[s("td",[t._v("dropdownStyle")]),t._v(" "),s("td",[t._v("To set the style of the dropdown menu")]),t._v(" "),s("td",[t._v("object")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("filterTreeNode")]),t._v(" "),s("td",[t._v("Whether to filter treeNodes by input value. The value of "),s("code",{pre:!0},[t._v("treeNodeFilterProp")]),t._v(" is used for filtering by default.")]),t._v(" "),s("td",[t._v("boolean|Function(inputValue: string, treeNode: TreeNode) (should return boolean)")]),t._v(" "),s("td",[t._v("Function")])]),t._v(" "),s("tr",[s("td",[t._v("getPopupContainer")]),t._v(" "),s("td",[t._v("To set the container of the dropdown menu. The default is to create a "),s("code",{pre:!0},[t._v("div")]),t._v(" element in "),s("code",{pre:!0},[t._v("body")]),t._v(", you can reset it to the scrolling area and make a relative reposition.")]),t._v(" "),s("td",[t._v("Function(triggerNode)")]),t._v(" "),s("td",[t._v("() => document.body")])]),t._v(" "),s("tr",[s("td",[t._v("labelInValue")]),t._v(" "),s("td",[t._v("whether to embed label in value, turn the format of value from "),s("code",{pre:!0},[t._v("string")]),t._v(" to "),s("code",{pre:!0},[t._v("{value: string, label: VNode, halfChecked: string[]}")])]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("loadData")]),t._v(" "),s("td",[t._v("Load data asynchronously.")]),t._v(" "),s("td",[t._v("function(node)")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("maxTagCount")]),t._v(" "),s("td",[t._v("Max tag count to show")]),t._v(" "),s("td",[t._v("number")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("maxTagPlaceholder")]),t._v(" "),s("td",[t._v("Placeholder for not showing tags")]),t._v(" "),s("td",[t._v("slot/function(omittedValues)")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("multiple")]),t._v(" "),s("td",[t._v("Support multiple or not, will be "),s("code",{pre:!0},[t._v("true")]),t._v(" when enable "),s("code",{pre:!0},[t._v("treeCheckable")]),t._v(".")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("placeholder")]),t._v(" "),s("td",[t._v("Placeholder of the select input")]),t._v(" "),s("td",[t._v("string|slot")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("searchPlaceholder")]),t._v(" "),s("td",[t._v("Placeholder of the search input")]),t._v(" "),s("td",[t._v("string|slot")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("searchValue(.sync)")]),t._v(" "),s("td",[t._v("work with "),s("code",{pre:!0},[t._v("search")]),t._v(" event to make search value controlled.")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("treeIcon")]),t._v(" "),s("td",[t._v("Shows the icon before a TreeNode's title. There is no default style; you must set a custom style for it if set to "),s("code",{pre:!0},[t._v("true")])]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("showCheckedStrategy")]),t._v(" "),s("td",[t._v("The way show selected item in box. "),s("strong",[t._v("Default:")]),t._v(" just show child nodes. "),s("strong",[s("code",{pre:!0},[t._v("TreeSelect.SHOW_ALL")]),t._v(":")]),t._v(" show all checked treeNodes (include parent treeNode). "),s("strong",[s("code",{pre:!0},[t._v("TreeSelect.SHOW_PARENT")]),t._v(":")]),t._v(" show checked treeNodes (just show parent treeNode).")]),t._v(" "),s("td",[t._v("enum { TreeSelect.SHOW_ALL, TreeSelect.SHOW_PARENT, TreeSelect.SHOW_CHILD }")]),t._v(" "),s("td",[t._v("TreeSelect.SHOW_CHILD")])]),t._v(" "),s("tr",[s("td",[t._v("showSearch")]),t._v(" "),s("td",[t._v("Whether to display a search input in the dropdown menu(valid only in the single mode)")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("size")]),t._v(" "),s("td",[t._v("To set the size of the select input, options: "),s("code",{pre:!0},[t._v("large")]),t._v(" "),s("code",{pre:!0},[t._v("small")])]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("'default'")])]),t._v(" "),s("tr",[s("td",[t._v("suffixIcon")]),t._v(" "),s("td",[t._v("The custom suffix icon")]),t._v(" "),s("td",[t._v("VNode | slot")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("treeCheckable")]),t._v(" "),s("td",[t._v("Whether to show checkbox on the treeNodes")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("treeCheckStrictly")]),t._v(" "),s("td",[t._v("Whether to check nodes precisely (in the "),s("code",{pre:!0},[t._v("checkable")]),t._v(" mode), means parent and child nodes are not associated, and it will make "),s("code",{pre:!0},[t._v("labelInValue")]),t._v(" be true")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("treeData")]),t._v(" "),s("td",[t._v("Data of the treeNodes, manual construction work is no longer needed if this property has been set(ensure the Uniqueness of each value)")]),t._v(" "),s("td",[t._v("array<{ value, title, children, [disabled, disableCheckbox, selectable] }>")]),t._v(" "),s("td",[t._v("[]")])]),t._v(" "),s("tr",[s("td",[t._v("treeDataSimpleMode")]),t._v(" "),s("td",[t._v("Enable simple mode of treeData. Changes the "),s("code",{pre:!0},[t._v("treeData")]),t._v(" schema to: [{id:1, pId:0, value:'1', title:\"test1\",...},...] where pId is parent node's id). It is possible to replace the default "),s("code",{pre:!0},[t._v("id")]),t._v(" and "),s("code",{pre:!0},[t._v("pId")]),t._v(" keys by providing object to "),s("code",{pre:!0},[t._v("treeDataSimpleMode")])]),t._v(" "),s("td",[t._v("false|object<{ id: string, pId: string, rootPId: null }>")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("treeDefaultExpandAll")]),t._v(" "),s("td",[t._v("Whether to expand all treeNodes by default")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("treeDefaultExpandedKeys")]),t._v(" "),s("td",[t._v("Default expanded treeNodes")]),t._v(" "),s("td",[t._v("string[] | number[]")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("treeExpandedKeys(.sync)")]),t._v(" "),s("td",[t._v("Set expanded keys")]),t._v(" "),s("td",[t._v("string[] | number[]")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("treeNodeFilterProp")]),t._v(" "),s("td",[t._v("Will be used for filtering if "),s("code",{pre:!0},[t._v("filterTreeNode")]),t._v(" returns true")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("'value'")])]),t._v(" "),s("tr",[s("td",[t._v("treeNodeLabelProp")]),t._v(" "),s("td",[t._v("Will render as content of select")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("'title'")])]),t._v(" "),s("tr",[s("td",[t._v("value(v-model)")]),t._v(" "),s("td",[t._v("To set the current selected treeNode(s).")]),t._v(" "),s("td",[t._v("string|string[]")]),t._v(" "),s("td",[t._v("-")])])])]),t._v(" "),s("h3",{attrs:{id:"Events"}},[t._v("Events "),s("a",{staticClass:"anchor",attrs:{href:"#Events"}},[t._v("#")])]),t._v(" "),s("table",[s("thead",[s("tr",[s("th",[t._v("Events Name")]),t._v(" "),s("th",[t._v("Description")]),t._v(" "),s("th",[t._v("Arguments")])])]),t._v(" "),s("tbody",[s("tr",[s("td",[t._v("change")]),t._v(" "),s("td",[t._v("A callback function, can be executed when selected treeNodes or input value change")]),t._v(" "),s("td",[t._v("function(value, label, extra)")])]),t._v(" "),s("tr",[s("td",[t._v("search")]),t._v(" "),s("td",[t._v("A callback function, can be executed when the search input changes.")]),t._v(" "),s("td",[t._v("function(value: string)")])]),t._v(" "),s("tr",[s("td",[t._v("select")]),t._v(" "),s("td",[t._v("A callback function, can be executed when you select a treeNode.")]),t._v(" "),s("td",[t._v("function(value, node, extra)")])]),t._v(" "),s("tr",[s("td",[t._v("treeExpand")]),t._v(" "),s("td",[t._v("A callback function, can be executed when treeNode expanded")]),t._v(" "),s("td",[t._v("function(expandedKeys)")])])])]),t._v(" "),s("h3",{attrs:{id:"Tree-Methods"}},[t._v("Tree Methods "),s("a",{staticClass:"anchor",attrs:{href:"#Tree-Methods"}},[t._v("#")])]),t._v(" "),s("table",[s("thead",[s("tr",[s("th",[t._v("Name")]),t._v(" "),s("th",[t._v("Description")])])]),t._v(" "),s("tbody",[s("tr",[s("td",[t._v("blur()")]),t._v(" "),s("td",[t._v("remove focus")])]),t._v(" "),s("tr",[s("td",[t._v("focus()")]),t._v(" "),s("td",[t._v("get focus")])])])]),t._v(" "),s("h3",{attrs:{id:"TreeNode-props"}},[t._v("TreeNode props "),s("a",{staticClass:"anchor",attrs:{href:"#TreeNode-props"}},[t._v("#")])]),t._v(" "),s("blockquote",[s("p",[t._v("We recommend you to use "),s("code",{pre:!0},[t._v("treeData")]),t._v(" rather than "),s("code",{pre:!0},[t._v("TreeNode")]),t._v(", to avoid the trouble of manual construction.")])]),t._v(" "),s("table",[s("thead",[s("tr",[s("th",[t._v("Property")]),t._v(" "),s("th",[t._v("Description")]),t._v(" "),s("th",[t._v("Type")]),t._v(" "),s("th",[t._v("Default")])])]),t._v(" "),s("tbody",[s("tr",[s("td",[t._v("selectable")]),t._v(" "),s("td",[t._v("can be selected")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("true")])]),t._v(" "),s("tr",[s("td",[t._v("disableCheckbox")]),t._v(" "),s("td",[t._v("Disables the checkbox of the treeNode")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("disabled")]),t._v(" "),s("td",[t._v("Disabled or not")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("isLeaf")]),t._v(" "),s("td",[t._v("Leaf node or not")]),t._v(" "),s("td",[t._v("boolean")]),t._v(" "),s("td",[t._v("false")])]),t._v(" "),s("tr",[s("td",[t._v("key")]),t._v(" "),s("td",[t._v("Required property, should be unique in the tree")]),t._v(" "),s("td",[t._v("string | number")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("title")]),t._v(" "),s("td",[t._v("Content showed on the treeNodes")]),t._v(" "),s("td",[t._v("string|slot")]),t._v(" "),s("td",[t._v("'---'")])]),t._v(" "),s("tr",[s("td",[t._v("value")]),t._v(" "),s("td",[t._v("Will be treated as "),s("code",{pre:!0},[t._v("treeNodeFilterProp")]),t._v(" by default, should be unique in the tree")]),t._v(" "),s("td",[t._v("string")]),t._v(" "),s("td",[t._v("-")])]),t._v(" "),s("tr",[s("td",[t._v("scopedSlots")]),t._v(" "),s("td",[t._v("When using treeNodes, you can use this property to configure the properties that support the slot, such as "),s("code",{pre:!0},[t._v("scopedSlots: { title: 'XXX'}")])]),t._v(" "),s("td",[t._v("object")]),t._v(" "),s("td",[t._v("-")])])])])])}],!1,null,null,null);E.options.__file="components/tree-select/index.en-US.md";var A=E.exports,H="# 树型选择控件\n ## 何时使用\n\n类似 Select 的选择控件,可选择的数据结构是一个树形结构时,可以使用 TreeSelect例如公司层级、学科系统、分类目录等等。\n\n ## 代码演示",W="# TreeSelect\n ## When To Use\n\n`TreeSelect` is similar to `Select`, but the values are provided in a tree like structure.\nAny data whose entries are defined in a hierarchical manner is fit to use this control. Examples of such case may include a corporate hierarchy, a directory structure, and so on.\n## Examples\n ",O={category:"Components",subtitle:"树选择",type:"Data Entry",title:"TreeSelect",render:function(){var t=arguments[0];return t("div",[t("md",{attrs:{cn:H,us:W}}),t(_),t(p),t(j),t(b),t(S),t("api",[t("template",{slot:"cn"},[t(D)]),t(A)])])}},I=Object(n.a)(O,void 0,void 0,!1,null,null,null);I.options.__file="components/tree-select/demo/index.vue";e.default=I.exports}}]);