muse-vue-ant-design-dashboard/documentation/_nuxt/38e0213.js

(window.webpackJsonp=window.webpackJsonp||[]).push([[9,2,3],{1179:function(e,t,n){"use strict";n.r(t);n(106),n(640);var l={props:["anchors"],data:function(){return{url:""}},beforeMount:function(){this.url=window.location.href.split("#")[0]}},o=n(81),component=Object(o.a)(l,(function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",{staticClass:"page-anchor"},[n("a-anchor",{attrs:{targetOffset:80,offsetTop:85}},e._l(e.anchors,(function(title,t){return n("a-anchor-link",{key:t,attrs:{href:e.url+"#"+t,title:title}})})),1)],1)}),[],!1,null,null,null);t.default=component.exports},1180:function(e,t,n){"use strict";n.r(t);var l={inheritAttrs:!0,props:["code","lang"],data:function(){return{}},methods:{onCopy:function(e){this.$message.success({content:"Copied!"})}}},o=n(81),component=Object(o.a)(l,(function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("section",{staticClass:"highlight-section"},[n("a-button",{directives:[{name:"clipboard",rawName:"v-clipboard:copy",value:e.code.trim(),expression:"code.trim()",arg:"copy"},{name:"clipboard",rawName:"v-clipboard:success",value:e.onCopy,expression:"onCopy",arg:"success"}],staticClass:"btn-copy",attrs:{type:"primary",icon:"copy",size:"small"}},[e._v("Copy")]),e._v(" "),n("highlight-code",{staticStyle:{"max-height":"500px"},attrs:{lang:e.lang?e.lang:"html"}},[e._v("\n\t\t"+e._s(e.code)+"\n\t")])],1)}),[],!1,null,null,null);t.default=component.exports},1223:function(e,t,n){"use strict";n.r(t);var l={head:function(){return{title:"Collapse | Muse Dashboard Ant Design Vue @ Creative Tim",meta:[{hid:"description",name:"description",content:"A content area which can be collapsed and expanded."}]}},data:function(){return{anchors:{Basic:"Basic"},text:"A dog is a type of domesticated animal.Known for its loyalty and faithfulness,it can be found as a welcome guest in many households across the world.",activeKey:["1"],codeSample:'\n<template>\n  <div>\n    <a-collapse v-model="activeKey">\n      <a-collapse-panel key="1" header="This is panel header 1">\n        <p>{{ text }}</p>\n      </a-collapse-panel>\n      <a-collapse-panel key="2" header="This is panel header 2" :disabled="false">\n        <p>{{ text }}</p>\n      </a-collapse-panel>\n      <a-collapse-panel key="3" header="This is panel header 3" disabled>\n        <p>{{ text }}</p>\n      </a-collapse-panel>\n    </a-collapse>\n  </div>\n</template>\n<script>\nexport default {\n  data() {\n    return {\n      text: \'A dog is a type of domesticated animal.Known for its loyalty and faithfulness,it can be found as a welcome guest in many households across the world.\',\n      activeKey: [\'1\'],\n    };\n  },\n  watch: {\n    activeKey(key) {\n      console.log(key);\n    },\n  },\n};\n<\/script>'}},methods:{}},o=n(81),component=Object(o.a)(l,(function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("div",[n("div",{staticClass:"page-row"},[n("div",{staticClass:"page-content"},[e._m(0),e._v(" "),n("a-divider"),e._v(" "),e._m(1),e._v(" "),n("h2",[e._v("Examples")]),e._v(" "),n("section",{staticClass:"mb-24",attrs:{id:"Basic"}},[n("a-divider",{attrs:{orientation:"left"}},[e._v("Basic")]),e._v(" "),n("p",[e._v("\n\t\t\t\t\t\tBy default, any number of panels can be expanded at a time. The first panel is expanded in this example.\n\t\t\t\t\t")]),e._v(" "),n("div",{staticClass:"showcase"},[n("a-collapse",{model:{value:e.activeKey,callback:function(t){e.activeKey=t},expression:"activeKey"}},[n("a-collapse-panel",{key:"1",attrs:{header:"This is panel header 1"}},[n("p",[e._v(e._s(e.text))])]),e._v(" "),n("a-collapse-panel",{key:"2",attrs:{header:"This is panel header 2",disabled:!1}},[n("p",[e._v(e._s(e.text))])]),e._v(" "),n("a-collapse-panel",{key:"3",attrs:{header:"This is panel header 3",disabled:""}},[n("p",[e._v(e._s(e.text))])])],1)],1),e._v(" "),n("muse-snippet",{attrs:{code:e.codeSample}})],1),e._v(" "),e._m(2)],1),e._v(" "),n("muse-anchor",{attrs:{anchors:e.anchors}})],1)])}),[function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("section",{staticClass:"mb-24"},[n("h1",[e._v("Collapse")]),e._v(" "),n("p",{staticClass:"text-dark"},[e._v("\n\t\t\t\t\t\tA content area which can be collapsed and expanded.\n\t\t\t\t\t")])])},function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("section",{staticClass:"mb-24"},[n("h2",[e._v("When To Use")]),e._v(" "),n("ul",[n("li",[e._v("Can be used to group or hide complex regions to keep the page clean.")]),e._v(" "),n("li",[e._v("‘Accordion’ is a special kind of ‘Collapse’, which allows only one panel to be expanded at a time.")])])])},function(){var e=this,t=e.$createElement,n=e._self._c||t;return n("p",{staticClass:"text-right font-semibold mb-24"},[e._v("\n\t\t\t\t\tLooking for more Ant Design Vue Collapse? Please check the\n\t\t\t\t\t"),n("a",{attrs:{target:"_blank",href:"https://antdv.com/components/collapse/"}},[e._v("official docs")]),e._v(".\n\t\t\t\t")])}],!1,null,"710be5b5",null);t.default=component.exports;installComponents(component,{MuseSnippet:n(1180).default,MuseAnchor:n(1179).default})}}]);