"use strict";(self["webpackChunklin_cms_vue"]=self["webpackChunklin_cms_vue"]||[]).push([[2698],{2698:function(l,e,a){a.r(e),a.d(e,{default:function(){return R}});var n=a(20641),u=a(90033);const o=l=>((0,n.Qi)("data-v-518303d7"),l=l(),(0,n.jt)(),l),i={class:"lin-container"},t=o((()=>(0,n.Lk)("div",{class:"lin-title"},"Cascader 级联选择器",-1))),b={class:"lin-wrap-ui"},v=o((()=>(0,n.Lk)("div",{slot:"header"},[(0,n.Lk)("span",null,"基础用法")],-1))),r={class:"block"},s=o((()=>(0,n.Lk)("span",{class:"demonstration"},"默认 click 触发子菜单",-1))),c={class:"block"},d=o((()=>(0,n.Lk)("span",{class:"demonstration"},"hover 触发子菜单",-1))),p={style:{"white-space":"pre-wrap"}},h=o((()=>(0,n.Lk)("div",{slot:"header"},[(0,n.Lk)("span",null,"禁用选项")],-1))),g=o((()=>(0,n.Lk)("span",{class:"demonstration"},"通过在数据源中设置 disabled 字段来声明该选项是禁用的",-1))),m={style:{"white-space":"pre-wrap"}},k=o((()=>(0,n.Lk)("div",{slot:"header"},[(0,n.Lk)("span",null,"仅显示最后一级")],-1))),f=o((()=>(0,n.Lk)("span",{class:"demonstration"},"可以仅在输入框中显示选中项最后一级的标签,而不是选中项所在的完整路径。",-1))),y={style:{"white-space":"pre-wrap"}},x=o((()=>(0,n.Lk)("div",{slot:"header"},[(0,n.Lk)("span",null,"默认值")],-1))),C={style:{"white-space":"pre-wrap"}},T=o((()=>(0,n.Lk)("div",{slot:"header"},[(0,n.Lk)("span",null,"选择即改变")],-1))),L=o((()=>(0,n.Lk)("span",{class:"demonstration"},"点击或移入选项即表示选中该项,可用于选择任意一级菜单的选项。",-1))),w={style:{"white-space":"pre-wrap"}},F=o((()=>(0,n.Lk)("div",{slot:"header"},[(0,n.Lk)("span",null,"动态加载次级选项")],-1))),P=o((()=>(0,n.Lk)("span",{class:"demonstration"},"当选中某一级时,动态加载该级下的选项。",-1))),D={style:{"white-space":"pre-wrap"}},z=o((()=>(0,n.Lk)("div",{slot:"header"},[(0,n.Lk)("span",null,"可搜索")],-1))),S={class:"block"},B=o((()=>(0,n.Lk)("span",{class:"demonstration"},"只可选择最后一级菜单的选项",-1))),N={class:"block"},_=o((()=>(0,n.Lk)("span",{class:"demonstration"},"可选择任意一级菜单的选项",-1))),I={style:{"white-space":"pre-wrap"}};function j(l,e,a,o,j,O){const M=(0,n.g2)("el-cascader"),A=(0,n.g2)("el-col"),R=(0,n.g2)("el-row"),U=(0,n.g2)("el-collapse-item"),V=(0,n.g2)("el-collapse"),W=(0,n.g2)("el-card");return(0,n.uX)(),(0,n.CE)("div",i,[t,(0,n.Lk)("div",b,[(0,n.bF)(W,{class:"box-card",style:{"margin-bottom":"50px"}},{default:(0,n.k6)((()=>[v,(0,n.bF)(R,null,{default:(0,n.k6)((()=>[(0,n.bF)(A,null,{default:(0,n.k6)((()=>[(0,n.Lk)("div",r,[s,(0,n.bF)(M,{options:j.options,modelValue:j.selectedOptions,"onUpdate:modelValue":e[0]||(e[0]=l=>j.selectedOptions=l),onChange:O.handleChange},null,8,["options","modelValue","onChange"])]),(0,n.Lk)("div",c,[d,(0,n.bF)(M,{"expand-trigger":"hover",options:j.options,modelValue:j.selectedOptions2,"onUpdate:modelValue":e[1]||(e[1]=l=>j.selectedOptions2=l),onChange:O.handleChange},null,8,["options","modelValue","onChange"])])])),_:1})])),_:1}),(0,n.bF)(V,null,{default:(0,n.k6)((()=>[(0,n.bF)(U,{title:"查看代码",name:"2"},{default:(0,n.k6)((()=>[(0,n.Lk)("div",p,(0,u.v_)(j.base),1)])),_:1})])),_:1})])),_:1}),(0,n.bF)(W,{style:{"margin-bottom":"50px"}},{default:(0,n.k6)((()=>[h,(0,n.bF)(R,null,{default:(0,n.k6)((()=>[(0,n.Lk)("div",null,[g,(0,n.bF)(M,{options:j.optionsWithDisabled},null,8,["options"])])])),_:1}),(0,n.bF)(V,null,{default:(0,n.k6)((()=>[(0,n.bF)(U,{title:"查看代码",name:"2"},{default:(0,n.k6)((()=>[(0,n.Lk)("div",m,(0,u.v_)(j.base),1)])),_:1})])),_:1})])),_:1}),(0,n.bF)(W,{style:{"margin-bottom":"50px"}},{default:(0,n.k6)((()=>[k,(0,n.bF)(R,null,{default:(0,n.k6)((()=>[(0,n.Lk)("div",null,[f,(0,n.bF)(M,{options:j.options,"show-all-levels":!1},null,8,["options"])])])),_:1}),(0,n.bF)(V,null,{default:(0,n.k6)((()=>[(0,n.bF)(U,{title:"查看代码",name:"2"},{default:(0,n.k6)((()=>[(0,n.Lk)("div",y,(0,u.v_)(j.showAllLevels),1)])),_:1})])),_:1})])),_:1}),(0,n.bF)(W,{style:{"margin-bottom":"50px"}},{default:(0,n.k6)((()=>[x,(0,n.bF)(R,null,{default:(0,n.k6)((()=>[(0,n.Lk)("div",null,[(0,n.bF)(M,{options:j.options1,modelValue:j.selectedOptions3,"onUpdate:modelValue":e[2]||(e[2]=l=>j.selectedOptions3=l)},null,8,["options","modelValue"])])])),_:1}),(0,n.bF)(V,null,{default:(0,n.k6)((()=>[(0,n.bF)(U,{title:"查看代码",name:"2"},{default:(0,n.k6)((()=>[(0,n.Lk)("div",C,(0,u.v_)(j.defaultValue),1)])),_:1})])),_:1})])),_:1}),(0,n.bF)(W,{style:{"margin-bottom":"50px"}},{default:(0,n.k6)((()=>[T,(0,n.bF)(R,null,{default:(0,n.k6)((()=>[(0,n.Lk)("div",null,[L,(0,n.bF)(M,{options:j.options,"change-on-select":""},null,8,["options"])])])),_:1}),(0,n.bF)(V,null,{default:(0,n.k6)((()=>[(0,n.bF)(U,{title:"查看代码",name:"2"},{default:(0,n.k6)((()=>[(0,n.Lk)("div",w,(0,u.v_)(j.changeOnSelect),1)])),_:1})])),_:1})])),_:1}),(0,n.bF)(W,{style:{"margin-bottom":"50px"}},{default:(0,n.k6)((()=>[F,(0,n.bF)(R,null,{default:(0,n.k6)((()=>[(0,n.Lk)("div",null,[P,(0,n.bF)(M,{options:j.options2,onActiveItemChange:O.handleItemChange,props:j.props},null,8,["options","onActiveItemChange","props"])])])),_:1}),(0,n.bF)(V,null,{default:(0,n.k6)((()=>[(0,n.bF)(U,{title:"查看代码",name:"2"},{default:(0,n.k6)((()=>[(0,n.Lk)("div",D,(0,u.v_)(j.activeItemChange),1)])),_:1})])),_:1})])),_:1}),(0,n.bF)(W,{style:{"margin-bottom":"50px"}},{default:(0,n.k6)((()=>[z,(0,n.bF)(R,null,{default:(0,n.k6)((()=>[(0,n.Lk)("div",S,[B,(0,n.bF)(M,{placeholder:"试试搜索:指南",options:j.options,filterable:""},null,8,["options"])]),(0,n.Lk)("div",N,[_,(0,n.bF)(M,{placeholder:"试试搜索:指南",options:j.options,filterable:"","change-on-select":""},null,8,["options"])])])),_:1}),(0,n.bF)(V,null,{default:(0,n.k6)((()=>[(0,n.bF)(U,{title:"查看代码",name:"2"},{default:(0,n.k6)((()=>[(0,n.Lk)("div",I,(0,u.v_)(j.filterable),1)])),_:1})])),_:1})])),_:1})])])}var O={data(){return{filterable:"\n
\n 只可选择最后一级菜单的选项\n \n
\n
\n 可选择任意一级菜单的选项\n \n
\n\n