element/docs.bb43290.js

webpackJsonp([0,2],[function(s,t,a){s.exports=a(1)},function(s,t,a){(function(s){"use strict";function t(s){return s&&s.__esModule?s:{default:s}}var n=a(2),l=t(n),e=a(3),h=t(e),i=a(19),r=t(i),c=a(20),o=t(c),p=a(536),_=t(p);a(858);var d=a(865),C=t(d),j=a(871),u=t(j),g=a(877),m=t(g),b=a(884),f=t(b),v=a(889),y=t(v),w=a(894),k=t(w);l.default.use(_.default),l.default.use(r.default),l.default.component("demo-block",C.default),l.default.component("main-footer",u.default),l.default.component("main-header",m.default),l.default.component("side-nav",f.default),l.default.component("footer-nav",y.default);var x=new r.default({mode:"hash",base:s,routes:o.default});x.afterEach(function(s){var t=k.default[s.meta.lang];for(var a in t)if(new RegExp("^"+a,"g").test(s.name))return void(document.title=t[a]);document.title="Element"}),new l.default({render:function(s){return s(h.default)},router:x}).$mount("#app")}).call(t,"/")},,function(s,t,a){var n,l;a(4),n=a(12);var e=a(18);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){},,,,,,,,function(s,t,a){"use strict";function n(s){return s&&s.__esModule?s:{default:s}}t.__esModule=!0;var l="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(s){return typeof s}:function(s){return s&&"function"==typeof Symbol&&s.constructor===Symbol&&s!==Symbol.prototype?"symbol":typeof s},e=a(13),h=a(14),i=n(h),r=a(17),c=n(r);(0,e.use)(location.href.indexOf("zh-CN")>-1?i.default:c.default),t.default={name:"app",computed:{lang:function(){return this.$route.path.split("/")[1]||"zh-CN"}},watch:{lang:function(){this.localize()}},methods:{localize:function(){(0,e.use)("zh-CN"===this.lang?i.default:c.default)},renderAnchorHref:function(){if(!/changelog/g.test(location.href)){var s=document.querySelectorAll("h2 a,h3 a"),t=location.href.split("#").splice(0,2).join("#");[].slice.call(s).forEach(function(s){var a=s.getAttribute("href");s.href=t+a})}},goAnchor:function(){if(location.href.match(/#/g).length>1){var s=function(){var s=location.href.match(/#[^#]+$/g);if(!s||1!==s.length)return{v:void 0};var t=document.querySelector(s[0]);return t?void setTimeout(function(s){document.documentElement.scrollTop=document.body.scrollTop=t.offsetTop},50):{v:void 0}}();if("object"===("undefined"==typeof s?"undefined":l(s)))return s.v}}},mounted:function(){this.localize(),this.renderAnchorHref(),this.goAnchor()},created:function(){var s=this;window.addEventListener("hashchange",function(){location.href.match(/#/g).length<2?(document.documentElement.scrollTop=document.body.scrollTop=0,s.renderAnchorHref()):s.goAnchor()})}}},,,,,function(s,t){"use strict";t.__esModule=!0,t.default={el:{datepicker:{now:"Now",today:"Today",cancel:"Cancel",clear:"Clear",confirm:"OK",selectDate:"Select date",selectTime:"Select time",startDate:"Start Date",startTime:"Start Time",endDate:"End Date",endTime:"End Time",year:"",month1:"January",month2:"February",month3:"March",month4:"April",month5:"May",month6:"June",month7:"July",month8:"August",month9:"September",month10:"October",month11:"November",month12:"December",weeks:{sun:"Sun",mon:"Mon",tue:"Tue",wed:"Wed",thu:"Thu",fri:"Fri",sat:"Sat"},months:{jan:"Jan",feb:"Feb",mar:"Mar",apr:"Apr",may:"May",jun:"Jun",jul:"Jul",aug:"Aug",sep:"Sep",oct:"Oct",nov:"Nov",dec:"Dec"}},select:{loading:"Loading",noMatch:"No matching data",noData:"No data",placeholder:"Select"},pagination:{goto:"Go to",pagesize:"/page",total:"Total {total}",pageClassifier:""},messagebox:{title:"Message",confirm:"OK",cancel:"Cancel",error:"Illegal input"},upload:{delete:"Delete",preview:"Preview",continue:"Continue"},table:{emptyText:"No Data",confirmFilter:"Confirm",resetFilter:"Reset",clearFilter:"All"},tree:{emptyText:"No Data"}}}},function(s,t){s.exports={render:function(){var s=this;return s._h("div",{attrs:{id:"app"}},["play"!==s.lang?s._h("main-header"):s._e(),s._h("div",{staticClass:"main-cnt"},[s._h("router-view")]),"play"!==s.lang?s._h("main-footer"):s._e()])},staticRe
attrs:{id:"1-0-0-rc-7"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#1-0-0-rc-7","aria-hidden":"true"}},["¶"])," 1.0.0-rc.7"]),s._h("p",[s._h("em",["2016-10-13"])]),s._h("ul",[s._h("li",["Upload 新增 Data 属性支持额外数据的传输"]),s._h("li",["DatePicker 修复 ",s._h("code",["$t"])," 报错"]),s._h("li",["Popper 重构 vue-popper"]),s._h("li",["Pagination 修复输入后再点击切换，输入框的值不更新"]),s._h("li",["Step: 修复自定义 icon 的样式"]),s._h("li",["修复 Tree 组件 checkbox 点击失效的问题"]),s._h("li",["Breadcrumb 增加路由跳转的功能"]),s._h("li",["修复 可清空的 Select 中清空按钮的不恰当动画"]),s._h("li",["DatePicker 修复使用 Tab 键切换时弹出框未隐藏"])]),s._h("h3",{attrs:{id:"1-0-0-rc-6"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#1-0-0-rc-6","aria-hidden":"true"}},["¶"])," 1.0.0-rc.6"]),s._h("p",[s._h("em",["2016-10-11"])]),s._h("ul",[s._h("li",["修复 Tabs 切换后 Tab-panel 被销毁的问题"]),s._h("li",["修复 TimePicker 错误的隐藏面板"]),s._h("li",["修复 Table Cell 的样式, #204"]),s._h("li",["修复 Menu default-active 属性不能为空的问题, #200"]),s._h("li",["修复 Menu unique-opened 开启后无法展开子菜单的问题, #200"]),s._h("li",["为 Notification 和 Message 的不同 type 添加独立的调用方法"]),s._h("li",["为 Message Box 和 Dialog 添加 lockScroll 属性，用于定义是否在弹框出现时将 body 滚动锁定"]),s._h("li",["新增 Input textarea 类型的 rows, autosize 属性"]),s._h("li",["为 Tree 添加 getCheckedNodes 方法和 node-click、check-change 回调"]),s._h("li",["新增 DatePicker 禁用日期功能 #253"]),s._h("li",["修复 多选可搜索的 Select 下拉选项自动展开的问题"]),s._h("li",["为 Dialog 添加 top 属性"]),s._h("li",["修复 Menu 组件垂直模式下开启 router 属性会立刻跳转的问题 #295"]),s._h("li",["Checkbox change 事件现在只能被人为的交互操作所触发"]),s._h("li",["新增 Checkbox checked 属性"]),s._h("li",["修复 Select 远程搜索时使用键盘选择选项无法更新 v-model 的问题"])]),s._h("h4",{attrs:{id:"fei-jian-rong-xing-geng-xin-3"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#fei-jian-rong-xing-geng-xin-3","aria-hidden":"true"}},["¶"])," 非兼容性更新"]),s._h("ul",[s._h("li",["Dropdown 组件重构，现在可以以更加的灵活方便的形式来自定义触发下拉的元素，以及可以定义下菜单的样式"])]),s._h("h3",{attrs:{id:"1-0-0-rc-5"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#1-0-0-rc-5","aria-hidden":"true"}},["¶"])," 1.0.0-rc.5"]),s._h("p",[s._h("em",["2016-09-30"])]),s._h("ul",[s._h("li",["修复 Table 头部不同步的问题"]),s._h("li",["修复 Menu 组件 default-active 绑定动态值无法更新的问题"]),s._h("li",["新增特性 Menu 组件中若选中子菜单项现在会自动展开所有父级菜单"]),s._h("li",["修复 vue-popper 引入 popper 路径错误"]),s._h("li",["修复 DatePicker 初始值是合法时间类型但无法设置成功的问题"]),s._h("li",["修复 Pagination 的图标没有正确切换样式, #163"]),s._h("li",["修复 Row 组件 align 属性不生效的问题"]),s._h("li",["修复 Tabs 关闭标签页时对应 Tab-panel 没有移除的问题"]),s._h("li",["新增 Menu 组件中 MenuItem 的 route 属性"])]),s._h("h4",{attrs:{id:"fei-jian-rong-xing-geng-xin-4"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#fei-jian-rong-xing-geng-xin-4","aria-hidden":"true"}},["¶"])," 非兼容性更新"]),s._h("ul",[s._h("li",["Menu 组件的 ",s._h("code",["unique-opend"])," 属性修正为 ",s._h("code",["unique-opened"])])]),s._h("h3",{attrs:{id:"1-0-0-rc-4"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#1-0-0-rc-4","aria-hidden":"true"}},["¶"])," 1.0.0-rc.4"]),s._h("p",[s._h("em",["2016-09-21"])]),s._h("ul",[s._h("li",["修复 Select 多选时选项变为空数组后 placeholder 不出现的问题"]),s._h("li",["修复 Time Picker 时间选择可滚动"]),s._h("l
},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-badge"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown"])," ",s._h("span",{staticClass:"hljs-attr"},["trigger"]),"=",s._h("span",{staticClass:"hljs-string"},['"click"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"el-dropdown-link"']),">"]),"\n    Click Me",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["i"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"el-icon-caret-bottom el-icon--right"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["i"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown-menu"])," ",s._h("span",{staticClass:"hljs-attr"},["slot"]),"=",s._h("span",{staticClass:"hljs-string"},['"dropdown"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"clearfix"']),">"]),"\n      comments\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-badge"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"mark"'])," ",s._h("span",{staticClass:"hljs-attr"},[":value"]),"=",s._h("span",{staticClass:"hljs-string"},['"12"'])," />"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"clearfix"']),">"]),"\n      replies\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-badge"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"mark"'])," ",s._h("span",{staticClass:"hljs-attr"},[":value"]),"=",s._h("span",{staticClass:"hljs-string"},['"3"'])," />"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-dropdown-menu"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-dropdown"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),s._h("span",{staticClass:"css"},["\n",s._h("span",{staticClass:"hljs-selector-class"},[".item"])," {\n  ",s._h("span",{staticClass:"hljs-attribute"},["margin-top"]),": ",s._h("span",{staticClass:"hljs-number"},["10px"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["margin-right"]),": ",s._h("span",{staticClass:"hljs-number"},["40px"]),";\n}\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),"\n"])])])]),s._m(4),s._m(5),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-badge :value="200" :max="99" class="item">\n  <el-button size="small">comments</el-button>\n</el-badge>\n<el-badge :value="100" :max="10" class="item">\n  <el-button size="small">replies</el-button>\n</el-badge>\n\n\n',script:null,style:"\n.item {\n  margin-top: 10px;\n  margin-right: 40px;\n}\n"}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-badge",{staticClass:"item",attrs:{max:99},domProps:{value:200}},[s._h("el-button",{attrs:{size:"small"}},["comments"])]),s._h("el-badge",{staticClass:"item",attrs:{max:10},dom
slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"'])," ",s._h("span",{staticClass:"hljs-attr"},["icon"]),"=",s._h("span",{staticClass:"hljs-string"},['"edit"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"'])," ",s._h("span",{staticClass:"hljs-attr"},["icon"]),"=",s._h("span",{staticClass:"hljs-string"},['"share"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"'])," ",s._h("span",{staticClass:"hljs-attr"},["icon"]),"=",s._h("span",{staticClass:"hljs-string"},['"delete"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"'])," ",s._h("span",{staticClass:"hljs-attr"},["icon"]),"=",s._h("span",{staticClass:"hljs-string"},['"search"']),">"]),"Search",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"']),">"]),"Upload",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["i"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"el-icon-upload el-icon-right"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["i"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n"])])])]),s._m(9),s._m(10),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-button-group>\n  <el-button type="primary" icon="arrow-left">Previous Page</el-button>\n  <el-button type="primary">Next Page<i class="el-icon-arrow-right el-icon-right"></i></el-button>\n</el-button-group>\n<el-button-group>\n  <el-button type="primary" icon="edit"></el-button>\n  <el-button type="primary" icon="share"></el-button>\n  <el-button type="primary" icon="delete"></el-button>\n</el-button-group>\n',script:null,style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-button-group",[s._h("el-button",{attrs:{type:"primary",icon:"arrow-left"}},["Previous Page"]),s._h("el-button",{attrs:{type:"primary"}},["Next Page",s._h("i",{staticClass:"el-icon-arrow-right el-icon-right"})])]),s._h("el-button-group",[s._h("el-button",{attrs:{type:"primary",icon:"edit"}}),s._h("el-button",{attrs:{type:"primary",icon:"share"}}),s._h("el-button",{attrs:{type:"primary",icon:"delete"}})])]),s._h("p",["Use tag ",s._h("code",["<el-button-group>"])," to group your buttons."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button-group"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"'])," ",s._h("span",{staticClass:"hljs-attr"},["icon"]),"=",s._h("span",{staticClass:"hljs-string"},['"ar
},function(s,t){"use strict";s.exports={data:function(){return{checkList:["selected and disabled","Option A"],checked:!0,checked1:!1,checked2:!0,isValid:"valid"}}}},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._m(3),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <!-- `checked` should be true or false -->\n  <el-checkbox v-model="checked">Option</el-checkbox>\n</template>\n\n',script:"\n  export default {\n    data() {\n      return {\n        checked: true\n      };\n    }\n  };\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-checkbox",{directives:[{name:"model",rawName:"v-model",value:s.checked,expression:"checked"}],domProps:{value:s.checked},on:{input:function(t){s.checked=t}}},["Option"])]]),s._h("p",["Define ",s._h("code",["v-model"]),"(bind variable) in ",s._h("code",["el-checkbox"]),". The default value is a ",s._h("code",["Boolean"])," for single ",s._h("code",["checkbox"]),", and it becomes ",s._h("code",["true"])," when selected."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-comment"},["<!-- `checked` should be true or false -->"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-checkbox"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"checked"']),">"]),"Option",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-checkbox"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["checked"]),": ",s._h("span",{staticClass:"hljs-literal"},["true"]),"\n      };\n    }\n  };\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(4),s._m(5),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-checkbox v-model="checked1" disabled>Option</el-checkbox>\n  <el-checkbox v-model="checked2" disabled>Option</el-checkbox>\n</template>\n\n',script:"\n  export default {\n    data() {\n      return {\n        checked1: false,\n        checked2: true\n      };\n    }\n  };\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-checkbox",{directives:[{name:"model",rawName:"v-model",value:s.checked1,expression:"checked1"}],attrs:{disabled:""},domProps:{value:s.checked1},on:{input:function(t){s.checked1=t}}},["Option"]),s._h("el-checkbox",{directives:[{name:"model",rawName:"v-model",value:s.checked2,expression:"checked2"}],attrs:{disabled:""},domProps:{value:s.checked2},on:{input:function(t){s.checked2=t}}},["Option"])]]),s._h("p",["Set the ",s._h("code",["disabled"])," attribute."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-checkbox"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"checked1"'])," ",s._h("span",{staticClass:"hljs-attr"},["disabled"]),">"]),"Option",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-checkbox"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-checkbox"])," ",s._h("span",{staticClass:"hljs-
},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["pickerOptions1"]),": {\n          ",s._h("span",{staticClass:"hljs-attr"},["shortcuts"]),": [{\n            ",s._h("span",{staticClass:"hljs-attr"},["text"]),": ",s._h("span",{staticClass:"hljs-string"},["'Today'"]),",\n            onClick(picker) {\n              picker.$emit(",s._h("span",{staticClass:"hljs-string"},["'pick'"]),", ",s._h("span",{staticClass:"hljs-keyword"},["new"])," ",s._h("span",{staticClass:"hljs-built_in"},["Date"]),"());\n            }\n          }, {\n            ",s._h("span",{staticClass:"hljs-attr"},["text"]),": ",s._h("span",{staticClass:"hljs-string"},["'Yesterday'"]),",\n            onClick(picker) {\n              ",s._h("span",{staticClass:"hljs-keyword"},["const"])," date = ",s._h("span",{staticClass:"hljs-keyword"},["new"])," ",s._h("span",{staticClass:"hljs-built_in"},["Date"]),"();\n              date.setTime(date.getTime() - ",s._h("span",{staticClass:"hljs-number"},["3600"])," * ",s._h("span",{staticClass:"hljs-number"},["1000"])," * ",s._h("span",{staticClass:"hljs-number"},["24"]),");\n              picker.$emit(",s._h("span",{staticClass:"hljs-string"},["'pick'"]),", date);\n            }\n          }, {\n            ",s._h("span",{staticClass:"hljs-attr"},["text"]),": ",s._h("span",{staticClass:"hljs-string"},["'A week ago'"]),",\n            onClick(picker) {\n              ",s._h("span",{staticClass:"hljs-keyword"},["const"])," date = ",s._h("span",{staticClass:"hljs-keyword"},["new"])," ",s._h("span",{staticClass:"hljs-built_in"},["Date"]),"();\n              date.setTime(date.getTime() - ",s._h("span",{staticClass:"hljs-number"},["3600"])," * ",s._h("span",{staticClass:"hljs-number"},["1000"])," * ",s._h("span",{staticClass:"hljs-number"},["24"])," * ",s._h("span",{staticClass:"hljs-number"},["7"]),");\n              picker.$emit(",s._h("span",{staticClass:"hljs-string"},["'pick'"]),", date);\n            }\n          }]\n        },\n        ",s._h("span",{staticClass:"hljs-attr"},["value1"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n        ",s._h("span",{staticClass:"hljs-attr"},["value2"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n      };\n    }\n  };\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(4),s._m(5),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<div class="block">\n  <span class="demonstration">Week</span>\n  <el-date-picker v-model="value3" type="week" format="Week WW" placeholder="Pick a week">\n  </el-date-picker>\n</div>\n<div class="block">\n  <span class="demonstration">Month</span>\n  <el-date-picker v-model="value4" type="month" placeholder="Pick a month">\n  </el-date-picker>\n</div>\n<div class="block">\n  <span class="demonstration">Year</span>\n  <el-date-picker v-model="value5" type="year" placeholder="Pick a year">\n  </el-date-picker>\n</div>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        value3: '',\n        value4: '',\n        value5: ''\n      };\n    }\n  };\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["Week"]),s._h("el-date-picker",{directives:[{name:"model",rawName:"v-model",value:s.value3,expression:"value3"}],attrs:{type:"week",format:"Week WW",placeholder:"Pick a week"},domProps:{value:s.value3},on:{input:function(t){s.value3=t}}})]),s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["Month"]),s._h("el-date-picker",{directives:[{name:"model",rawName:"v-model",value:s.value4,expression:"value4"}],attrs:{type:"month",placeholder:"Pick a month"},domProps:{value:s.value4},on:{input:function(t){s.value4=t}}})]),s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["Year"]),s._h("el-date-picker",{directives:[{name:"model",rawName:"v-model",value
staticClass:"hljs-attr"},["value1"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n        ",s._h("span",{staticClass:"hljs-attr"},["value2"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),"\n      };\n    }\n  };\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(3),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <div class="block">\n    <span class="demonstration">Default</span>\n    <el-date-picker v-model="value3" type="datetimerange" placeholder="Select time range" style="width:350px">\n    </el-date-picker>\n  </div>\n  <div class="block">\n    <span class="demonstration">With shortcuts</span>\n    <el-date-picker v-model="value4" type="datetimerange" :picker-options="pickerOptions2" placeholder="Select time range" align="right" style="width:350px">\n    </el-date-picker>\n  </div>\n</template>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        pickerOptions2: {\n          shortcuts: [{\n            text: 'Last week',\n            onClick(picker) {\n              const end = new Date();\n              const start = new Date();\n              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);\n              picker.$emit('pick', [start, end]);\n            }\n          }, {\n            text: 'Last month',\n            onClick(picker) {\n              const end = new Date();\n              const start = new Date();\n              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);\n              picker.$emit('pick', [start, end]);\n            }\n          }, {\n            text: 'Last 3 months',\n            onClick(picker) {\n              const end = new Date();\n              const start = new Date();\n              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);\n              picker.$emit('pick', [start, end]);\n            }\n          }]\n        },\n        value3: '',\n        value4: ''\n      };\n    }\n  };\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["Default"]),s._h("el-date-picker",{directives:[{name:"model",rawName:"v-model",value:s.value3,expression:"value3"}],staticStyle:{width:"350px"},attrs:{type:"datetimerange",placeholder:"Select time range"},domProps:{value:s.value3},on:{input:function(t){s.value3=t}}})]),s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["With shortcuts"]),s._h("el-date-picker",{directives:[{name:"model",rawName:"v-model",value:s.value4,expression:"value4"}],staticStyle:{width:"350px"},attrs:{type:"datetimerange","picker-options":s.pickerOptions2,placeholder:"Select time range",align:"right"},domProps:{value:s.value4},on:{input:function(t){s.value4=t}}})])]]),s._h("p",["You can select date and time range by setting ",s._h("code",["type"])," to ",s._h("code",["datetimerange"]),"."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"block"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demonstration"']),">"]),"Default",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-date-picker"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value3"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"datetimerange"']),"\n      ",s._h("span",{
staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["slot"]),"=",s._h("span",{staticClass:"hljs-string"},['"footer"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"dialog-footer"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"dialogFormVisible = false"']),">"]),"Cancel",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"'])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"dialogFormVisible = false"']),">"]),"Confirm",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-dialog"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["gridData"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-02'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'John Smith'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No.1518,  Jinshajiang Road, Putuo District'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-04'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'John Smith'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No.1518,  Jinshajiang Road, Putuo District'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-01'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'John Smith'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No.1518,  Jinshajiang Road, Putuo District'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-03'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'John Smith'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No.1518,  Jinshajiang Road, Putuo District'"]),"\n        }],\n        ",s._h("span",{staticClass:"hljs-attr"},["dialogTableVisible"]),": ",s._h("span",{staticClass:"hljs-literal"},["false"]),",\n        ",s._h("span",{staticClass:"hljs-attr"},["dialogFormVisible"]),": ",s._h("span",{staticClass:"hljs-literal"},["false"]),",\n        ",s._h("span",{staticClass:"hljs-attr"},["form"]),": {\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["region"]),": ",s._h(
},function(){var s=this;return s._h("h3",{attrs:{id:"dropdown-events"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#dropdown-events","aria-hidden":"true"}},["¶"])," Dropdown Events"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["Event Name"]),s._h("th",["Description"]),s._h("th",["Parameters"])])]),s._h("tbody",[s._h("tr",[s._h("td",["click"]),s._h("td",["if ",s._h("code",["split-button"])," is ",s._h("code",["true"]),", triggers when left button is clicked"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["command"]),s._h("td",["triggers when a dropdown item is clicked"]),s._h("td",["the command dispatched from the dropdown item"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"dropdown-menu-item-attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#dropdown-menu-item-attributes","aria-hidden":"true"}},["¶"])," Dropdown Menu Item Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["Attribute"]),s._h("th",["Description"]),s._h("th",["Type"]),s._h("th",["Accepted Values"]),s._h("th",["Default"])])]),s._h("tbody",[s._h("tr",[s._h("td",["command"]),s._h("td",["a command to be dispatched to Dropdown's ",s._h("code",["command"])," callback"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["disabled"]),s._h("td",["whether the item is disabled"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])]),s._h("tr",[s._h("td",["divided"]),s._h("td",["whether a divider is displayed"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])])])])}]}},function(s,t,a){s.exports=a(104)},function(s,t,a){var n,l;a(105),n=a(107);var e=a(108);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){},,function(s,t){"use strict";t.__esModule=!0,t.default={data:function(){var s=this,t=function(s,t,a){return t?void setTimeout(function(){Number.isInteger(t)?t<18?a(new Error("Age must be greater than 18")):a():a(new Error("Please input digits"))},1e3):a(new Error("Please input the age"))},a=function(t,a,n){""===a?n(new Error("Please input the password")):(""!==s.ruleForm2.checkPass&&s.$refs.ruleForm2.validateField("checkPass"),n())},n=function(t,a,n){""===a?n(new Error("Please input the password again")):a!==s.ruleForm2.pass?n(new Error("Two inputs don't match!")):n()};return{form:{name:"",region:"",date1:"",date2:"",delivery:!1,type:[],resource:"",desc:""},formInline:{user:"",region:""},formStacked:{name:"",region:"",type:"",remark:""},formAlignRight:{name:"",region:"",type:""},formAlignLeft:{name:"",region:"",type:""},ruleForm:{name:"",region:"",date1:"",date2:"",delivery:!1,type:[],resource:"",desc:""},ruleForm2:{pass:"",checkPass:"",age:""},formLabelWidth:"80px",options:[],rules:{name:[{required:!0,message:"Please input Activity name",trigger:"blur"},{min:3,max:5,message:"Length should be 3 to 5",trigger:"blur"}],region:[{required:!0,message:"Please select Activity zone",trigger:"change"}],date1:[{type:"date",required:!0,message:"Please pick a date",trigger:"change"}],date2:[{type:"date",required:!0,message:"Please pick a time",trigger:"change"}],type:[{type:"array",required:!0,message:"Please select at least one activity type",trigger:"change"}],resource:[{required:!0,message:"Please select activity resource",trigger:"change"}],desc:[{required:!0,message:"Please input activity form",trigger:"blur"}]},rules2:{pass:[{validator:a,trigger:"blur"}],checkPass:[{validator:n,trigger:"blur"}],age:[{validator:t,trigger:"blur"}]},dynamicForm:{domains:[{key:Date.now(),value:""}],email:""},dynamicRule:{email:[{required:!0,message:"Please input email address",trigger:"blur"},{type:"email",message:"Please input correct email address",trigger:"blur,change"}]}}},methods:{handleSubmit:function(s){this.$refs.ruleForm.validate(function(s){return s?void alert("submit!"):(console.log("error submit!!"),!1)})},handleSub
attrs:{label:"Activity zone"}},[s._h("el-input",{directives:[{name:"model",rawName:"v-model",value:s.formStacked.region,expression:"formStacked.region"}],domProps:{value:s.formStacked.region},on:{input:function(t){s.formStacked.region=t}}})]),s._h("el-form-item",{attrs:{label:"Activity form"}},[s._h("el-input",{directives:[{name:"model",rawName:"v-model",value:s.formStacked.type,expression:"formStacked.type"}],domProps:{value:s.formStacked.type},on:{input:function(t){s.formStacked.type=t}}})])])]),s._h("p",["The ",s._h("code",["label-position"])," attribute decides how labels align, it can be ",s._h("code",["top"])," or ",s._h("code",["left"]),". When set to ",s._h("code",["top"]),", labels will be placed at the top of the form field."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form"])," ",s._h("span",{staticClass:"hljs-attr"},["label-position"]),"=",s._h("span",{staticClass:"hljs-string"},['"top"'])," ",s._h("span",{staticClass:"hljs-attr"},[":model"]),"=",s._h("span",{staticClass:"hljs-string"},['"formStacked"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demo-form-stacked"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Name"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-input"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"formStacked.name"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-input"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Activity zone"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-input"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"formStacked.region"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-input"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Activity form"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-input"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"formStacked.type"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-input"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["formStacked"]),": {\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["region"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n    
staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-checkbox"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Offline activities"'])," ",s._h("span",{staticClass:"hljs-attr"},["name"]),"=",s._h("span",{staticClass:"hljs-string"},['"type"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-checkbox"]),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-checkbox"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Simple brand exposure"'])," ",s._h("span",{staticClass:"hljs-attr"},["name"]),"=",s._h("span",{staticClass:"hljs-string"},['"type"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-checkbox"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-checkbox-group"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Resources"'])," ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"resource"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio-group"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"ruleForm.resource"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Sponsorship"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-radio"]),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Venue"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-radio"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-radio-group"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Activity form"'])," ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"desc"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-input"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"textarea"'])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"ruleForm.desc"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-input"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"'])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleSubmit"']),">"]),"Create",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs
staticClass:"hljs-attr"},[":prop"]),"=",s._h("span",{staticClass:"hljs-string"},["\"'domains.' + index + '.value'\""]),"\n    ",s._h("span",{staticClass:"hljs-attr"},[":rules"]),"=",s._h("span",{staticClass:"hljs-string"},["\"{\n      required: true, message: 'domain can not be null', trigger: 'blur'\n    }\""]),"\n  >"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-input"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"domain.value"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-input"]),">"]),s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["@click.prevent"]),"=",s._h("span",{staticClass:"hljs-string"},['"removeDomain(domain)"']),">"]),"Delete",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"'])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleSubmit3"']),">"]),"Submit",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"addDomain"']),">"]),"New domain",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleReset3"']),">"]),"Reset",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["dynamicForm"]),": {\n          ",s._h("span",{staticClass:"hljs-attr"},["domains"]),": [{\n            ",s._h("span",{staticClass:"hljs-attr"},["key"]),": ",s._h("span",{staticClass:"hljs-number"},["1"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),"\n          }],\n          ",s._h("span",{staticClass:"hljs-attr"},["email"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),"\n        },\n        ",s._h("span",{staticClass:"hljs-attr"},["dynamicRule"]),": {\n          ",s._h("span",{staticClass:"hljs-attr"},["email"]),": [\n            { ",s._h("span",{staticClass:"hljs-attr"},["required"]),": ",s._h("span",{staticClass:"hljs-literal"},["true"]),", ",s._h("span",{staticClass:"hljs-attr"},["message"]),": ",s._h("span",{staticClass:"hljs-string"},["'Please input email address'"]),", ",s._h("span",{staticClass:"hljs-attr"},["trigger"]),": ",s._h("span",{staticClass:"hljs-string"},["'blur'"])," },\n            { ",s._h("span",{staticClass:"hljs-attr"},["type"]),": ",s._h("span",{staticClass:"hljs-string"},["'email'"]),", ",s._h("span",{stat
links:[],input:"",input1:"",input2:"",input3:"",input4:"",input5:"",input6:"",input7:"",input8:"",input9:"",textarea:"",select:"",state1:"",state2:"",state3:"",state4:""}},methods:{loadAll:function(){return[{value:"vue",link:"https://github.com/vuejs/vue"},{value:"element",link:"https://github.com/ElemeFE/element"},{value:"cooking",link:"https://github.com/ElemeFE/cooking"},{value:"mint-ui",link:"https://github.com/ElemeFE/mint-ui"},{value:"vuex",link:"https://github.com/vuejs/vuex"},{value:"vue-router",link:"https://github.com/vuejs/vue-router"},{value:"babel",link:"https://github.com/babel/babel"}]},querySearch:function(s,t){var a=this.links,n=s?a.filter(this.createStateFilter(s)):a;t(n)},querySearchAsync:function(s,t){var a=this.links,n=s?a.filter(this.createStateFilter(s)):a;clearTimeout(this.timeout),this.timeout=setTimeout(function(){t(n)},3e3*Math.random())},createStateFilter:function(s){return function(t){return 0===t.value.indexOf(s.toLowerCase())}},handleSelect:function(s){console.log(s)},handleIconClick:function(s){console.log(s)}},mounted:function(){this.links=this.loadAll()}}},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-input placeholder="Please input" v-model="input">\n</el-input>\n\n\n',script:"\nexport default {\n  data() {\n    return {\n      input: ''\n    }\n  }\n}\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-input",{directives:[{name:"model",rawName:"v-model",value:s.input,expression:"input"}],attrs:{placeholder:"Please input"},domProps:{value:s.input},on:{input:function(t){s.input=t}}})]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-input"]),"\n  ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"Please input"']),"\n  ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"input"']),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-input"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n  data() {\n    ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n      ",s._h("span",{staticClass:"hljs-attr"},["input"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),"\n    }\n  }\n}\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(3),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-input placeholder="Please input" v-model="input1" :disabled="true">\n</el-input>\n\n\n',script:"\nexport default {\n  data() {\n    return {\n      input1: ''\n    }\n  }\n}\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-input",{directives:[{name:"model",rawName:"v-model",value:s.input1,expression:"input1"}],attrs:{placeholder:"Please input",disabled:!0},domProps:{value:s.input1},on:{input:function(t){s.input1=t}}})]),s._h("p",["Disable the Input with the ",s._h("code",["disabled"])," attribute."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-input"]),"\n  ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"Please input"']),"\n  ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"input1"']),"\n  ",s._h("span",{staticClass:"hljs-attr"},[":disabled"]),"=",s._h("span",{staticClass:"hljs-string"},['"true"']),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClas
staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"vue"']),", ",s._h("span",{staticClass:"hljs-string"},['"link"']),": ",s._h("span",{staticClass:"hljs-string"},['"https://github.com/vuejs/vue"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"element"']),", ",s._h("span",{staticClass:"hljs-string"},['"link"']),": ",s._h("span",{staticClass:"hljs-string"},['"https://github.com/ElemeFE/element"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"cooking"']),", ",s._h("span",{staticClass:"hljs-string"},['"link"']),": ",s._h("span",{staticClass:"hljs-string"},['"https://github.com/ElemeFE/cooking"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"mint-ui"']),", ",s._h("span",{staticClass:"hljs-string"},['"link"']),": ",s._h("span",{staticClass:"hljs-string"},['"https://github.com/ElemeFE/mint-ui"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"vuex"']),", ",s._h("span",{staticClass:"hljs-string"},['"link"']),": ",s._h("span",{staticClass:"hljs-string"},['"https://github.com/vuejs/vuex"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"vue-router"']),", ",s._h("span",{staticClass:"hljs-string"},['"link"']),": ",s._h("span",{staticClass:"hljs-string"},['"https://github.com/vuejs/vue-router"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"babel"']),", ",s._h("span",{staticClass:"hljs-string"},['"link"']),": ",s._h("span",{staticClass:"hljs-string"},['"https://github.com/babel/babel"'])," }\n         ];\n      },\n      handleSelect(item) {\n        ",s._h("span",{staticClass:"hljs-built_in"},["console"]),".log(item);\n      }\n    },\n    mounted() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["this"]),".links = ",s._h("span",{staticClass:"hljs-keyword"},["this"]),".loadAll();\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(13),s._m(14),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-autocomplete class="my-autocomplete" v-model="state3" :fetch-suggestions="querySearch" custom-item="my-item-en" placeholder="Please input" @select="handleSelect"></el-autocomplete>\n\n\n\n\n',script:'\n  Vue.component(\'my-item-en\', {\n    functional: true,\n    render: function (h, ctx) {\n      var item = ctx.props.item;\n      return h(\'li\', ctx.data, [\n        h(\'div\', { attrs: { class: \'value\' } }, [item.value]),\n        h(\'span\', { attrs: { class: \'link\' } }, [item.link])\n      ]);\n    },\n    props: {\n      item: { type: Object, required: true }\n    }\n  });\n  export default {\n    data() {\n      return {\n        links: [],\n        state3: \'\'\n      };\n    },\n    methods: {\n      querySearch(queryString, cb) {\n        var links = this.links;\n        var results = queryString ? link.filter(this.createFilter(queryString)) : links;\n        // call callback function to return recommended data\n        cb(results);\n      },\n      createFilter(queryString) {\n        return (link) => {\n          return (link.value.indexOf(queryString.toLowerCase()) === 0);\n        };\n      },\n      loadAll() {\n        return [\n          { "value": "vue", "link": "https://github.com/vuejs/vue" },\n          { "value": "element", "link": "https://github.com/ElemeFE/element" },\n          { "value": "cooking", "link": "https://github.com/ElemeFE/cooking" },\n          { "value": "mint-ui", "link": "https://github.com/ElemeFE/mint-ui" },\n          { "value": "vuex", "link": "https://github.com/vuejs/vuex" },\n          { "value": "vue-router", "link": "https://github.com/vuejs/vue-router" },\n          { "value": "babel", "link": "https://gith
},["div"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["body"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-comment"},["<!-- import Vue before Element -->"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"])," ",s._h("span",{staticClass:"hljs-attr"},["src"]),"=",s._h("span",{staticClass:"hljs-string"},['"https://unpkg.com/vue/dist/vue.js"']),">"]),s._h("span",{staticClass:"undefined"}),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-comment"},["<!-- import JavaScript -->"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"])," ",s._h("span",{staticClass:"hljs-attr"},["src"]),"=",s._h("span",{staticClass:"hljs-string"},['"https://unpkg.com/element-ui/lib/index.js"']),">"]),s._h("span",{staticClass:"undefined"}),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"actionscript"},["\n    ",s._h("span",{staticClass:"hljs-keyword"},["new"])," Vue({\n      el: ",s._h("span",{staticClass:"hljs-string"},["'#app'"]),",\n      data: ",s._h("span",{staticClass:"hljs-function"},[s._h("span",{staticClass:"hljs-keyword"},["function"]),s._h("span",{staticClass:"hljs-params"},["()"])]),"{\n        ",s._h("span",{staticClass:"hljs-keyword"},["return"])," { visible: ",s._h("span",{staticClass:"hljs-literal"},["false"])," }\n      }\n    })\n  "]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["html"]),">"]),"\n"])]),s._h("p",["If you are using npm and wish to apply webpack, please continue to the next page: Quick Start."])])}]}},function(s,t,a){s.exports=a(136)},function(s,t,a){var n,l,e=a(137);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._m(3),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-row>\n  <el-col :span="24"><div class="grid-content bg-purple-dark"></div></el-col>\n</el-row>\n<el-row>\n  <el-col :span="12"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="12"><div class="grid-content bg-purple-light"></div></el-col>\n</el-row>\n<el-row>\n  <el-col :span="8"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="8"><div class="grid-content bg-purple-light"></div></el-col>\n  <el-col :span="8"><div class="grid-content bg-purple"></div></el-col>\n</el-row>\n<el-row>\n  <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>\n  <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="6"><div class="grid-content bg-purple-light"></div></el-col>\n</el-row>\n<el-row>\n  <el-col :span="4"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="4"><div class="grid-content bg-purple-light"></div></el-col>\n  <el-col :span="4"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="4"><div class="grid-content bg-purple-light"></div></el-col>\n  <el-col :span="4"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="4"><div class="grid-content bg-purple-light"></div></el-col>\n</el-row>\n\n\n',script:null,style:"\n  .el-row {\n    margin-bottom: 20px;\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n  .el-col {\n    border-radius: 4px;\n  }\n  .bg-purple-dark {\n    background: #99a9bf;\n  }\n  .bg-purple {\n    background: #d3dce6;\n  }\n  .bg-purple-light {\n    background: #e5e9f2;\n  }\n  .grid-content {\n    border-radius: 4px
},["\n  .el-row {\n    margin-bottom: 20px;\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n  .el-col {\n    border-radius: 4px;\n  }\n  .bg-purple-dark {\n    background: #99a9bf;\n  }\n  .bg-purple {\n    background: #d3dce6;\n  }\n  .bg-purple-light {\n    background: #e5e9f2;\n  }\n  .grid-content {\n    border-radius: 4px;\n    min-height: 36px;\n  }\n  .row-bg {\n    padding: 10px 0;\n    background-color: #f9fafc;\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),"\n"])])])]),s._m(8),s._m(9),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-row :gutter="20">\n  <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="6" :offset="6"><div class="grid-content bg-purple"></div></el-col>\n</el-row>\n<el-row :gutter="20">\n  <el-col :span="6" :offset="6"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="6" :offset="6"><div class="grid-content bg-purple"></div></el-col>\n</el-row>\n<el-row :gutter="20">\n  <el-col :span="12" :offset="6"><div class="grid-content bg-purple"></div></el-col>\n</el-row>\n\n\n',script:null,style:"\n  .el-row {\n    margin-bottom: 20px;\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n  .el-col {\n    border-radius: 4px;\n  }\n  .bg-purple-dark {\n    background: #99a9bf;\n  }\n  .bg-purple {\n    background: #d3dce6;\n  }\n  .bg-purple-light {\n    background: #e5e9f2;\n  }\n  .grid-content {\n    border-radius: 4px;\n    min-height: 36px;\n  }\n  .row-bg {\n    padding: 10px 0;\n    background-color: #f9fafc;\n  }\n"}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-row",{attrs:{gutter:20}},[s._h("el-col",{attrs:{span:6}},[s._h("div",{staticClass:"grid-content bg-purple"})]),s._h("el-col",{attrs:{span:6,offset:6}},[s._h("div",{staticClass:"grid-content bg-purple"})])]),s._h("el-row",{attrs:{gutter:20}},[s._h("el-col",{attrs:{span:6,offset:6}},[s._h("div",{staticClass:"grid-content bg-purple"})]),s._h("el-col",{attrs:{span:6,offset:6}},[s._h("div",{staticClass:"grid-content bg-purple"})])]),s._h("el-row",{attrs:{gutter:20}},[s._h("el-col",{attrs:{span:12,offset:6}},[s._h("div",{staticClass:"grid-content bg-purple"})])])]),s._h("p",["You can specify the number of column offset by setting the value of ",s._h("code",["offset"])," attribute of Col."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-row"])," ",s._h("span",{staticClass:"hljs-attr"},[":gutter"]),"=",s._h("span",{staticClass:"hljs-string"},['"20"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"6"']),">"]),s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"grid-content bg-purple"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"6"'])," ",s._h("span",{staticClass:"hljs-attr"},[":offset"]),"=",s._h("span",{staticClass:"hljs-string"},['"6"']),">"]),s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"grid-content bg-purple"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n",s._h("span",{staticClass:"hljs-
staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},["v-loading.body"]),"=",s._h("span",{staticClass:"hljs-string"},['"loading"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},[":data"]),"=",s._h("span",{staticClass:"hljs-string"},['"tableData"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["style"]),"=",s._h("span",{staticClass:"hljs-string"},['"width: 100%"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"date"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Date"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"180"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"name"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Name"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"180"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"address"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Address"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),s._h("span",{staticClass:"css"},["\n  ",s._h("span",{staticClass:"hljs-selector-tag"},["body"])," {\n    ",s._h("span",{staticClass:"hljs-attribute"},["margin"]),": ",s._h("span",{staticClass:"hljs-number"},["0"]),";\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["tableData"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-02'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'John Smith'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No.1518,  Jinshajiang Road, Putuo District'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-04'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'John Smith'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No.1518,  Jinshajiang Road, Putuo District'"]),"\n        }, {\n          ",s._h("span",{stati
script:"\n  export default {\n    methods: {\n      handleOpen(key, keyPath) {\n        console.log(key, keyPath);\n      },\n      handleClose(key, keyPath) {\n        console.log(key, keyPath);\n      }\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-row",{staticClass:"tac"},[s._h("el-col",{attrs:{span:8}},[s._h("h5",["With icons"]),s._h("el-menu",{staticClass:"el-menu-vertical-demo",attrs:{"default-active":"2"},on:{open:s.handleOpen,close:s.handleClose}},[s._h("el-submenu",{attrs:{index:"1"}},[s._h("template",{slot:"title"},[s._h("i",{staticClass:"el-icon-message"}),"Navigator One"]),s._h("el-menu-item-group",{attrs:{title:"Group One"}},[s._h("el-menu-item",{attrs:{index:"1-1"}},["item one"]),s._h("el-menu-item",{attrs:{index:"1-2"}},["item one"])]),s._h("el-menu-item-group",{attrs:{title:"Group Two"}},[s._h("el-menu-item",{attrs:{index:"1-3"}},["item three"])])]),s._h("el-menu-item",{attrs:{index:"2"}},[s._h("i",{staticClass:"el-icon-menu"}),"Navigator Two"]),s._h("el-menu-item",{attrs:{index:"3"}},[s._h("i",{staticClass:"el-icon-setting"}),"Navigator Three"])])]),s._h("el-col",{attrs:{span:8}},[s._h("h5",["Without icons"]),s._h("el-menu",{staticClass:"el-menu-vertical-demo",attrs:{"default-active":"2",theme:"dark"},on:{open:s.handleOpen,close:s.handleClose}},[s._h("el-submenu",{attrs:{index:"1"}},[s._h("template",{slot:"title"},["Navigator One"]),s._h("el-menu-item-group",{attrs:{title:"Group One"}},[s._h("el-menu-item",{attrs:{index:"1-1"}},["item one"]),s._h("el-menu-item",{attrs:{index:"1-2"}},["item two"])]),s._h("el-menu-item-group",{attrs:{title:"Group Two"}},[s._h("el-menu-item",{attrs:{index:"1-3"}},["item three"])])]),s._h("el-menu-item",{attrs:{index:"2"}},["Navigator Two"]),s._h("el-menu-item",{attrs:{index:"3"}},["Navigator Three"])])]),s._h("el-col",{attrs:{span:8}},[s._h("h5",["Groups"]),s._h("el-menu",{staticClass:"el-menu-vertical-demo",attrs:{mode:"vertical","default-active":"1"}},[s._h("el-menu-item-group",{attrs:{title:"Group One"}},[s._h("el-menu-item",{attrs:{index:"1"}},[s._h("i",{staticClass:"el-icon-message"}),"Navigator One"]),s._h("el-menu-item",{attrs:{index:"2"}},[s._h("i",{staticClass:"el-icon-message"}),"Navigator Two"])]),s._h("el-menu-item-group",{attrs:{title:"Group Two"}},[s._h("el-menu-item",{attrs:{index:"3"}},[s._h("i",{staticClass:"el-icon-message"}),"Navigator Three"]),s._h("el-menu-item",{attrs:{index:"4"}},[s._h("i",{staticClass:"el-icon-message"}),"Navigator Four"])])])])])]),s._h("p",["You can use the el-menu-item-group component to create a menu group, and the name of the group is determined by the title prop or a named slot."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-row"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"tac"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"8"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["h5"]),">"]),"With icons",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["h5"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-menu"])," ",s._h("span",{staticClass:"hljs-attr"},["default-active"]),"=",s._h("span",{staticClass:"hljs-string"},['"2"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"el-menu-vertical-demo"'])," ",s._h("span",{staticClass:"hljs-attr"},["@open"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleOpen"'])," ",s._h("span",{staticClass:"hljs-attr"},["@close"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleClose"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-submenu"]),
},["confirmButtonText"]),": ",s._h("span",{staticClass:"hljs-string"},["'OK'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["cancelButtonText"]),": ",s._h("span",{staticClass:"hljs-string"},["'Cancel'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["type"]),": ",s._h("span",{staticClass:"hljs-string"},["'warning'"]),"\n        }).then(",s._h("span",{staticClass:"hljs-function"},[s._h("span",{staticClass:"hljs-params"},["()"])," =>"])," {\n          ",s._h("span",{staticClass:"hljs-keyword"},["this"]),".$message({\n            ",s._h("span",{staticClass:"hljs-attr"},["type"]),": ",s._h("span",{staticClass:"hljs-string"},["'success'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["message"]),": ",s._h("span",{staticClass:"hljs-string"},["'Delete completed'"]),"\n          });\n        }).catch(",s._h("span",{staticClass:"hljs-function"},[s._h("span",{staticClass:"hljs-params"},["()"])," =>"])," {\n          ",s._h("span",{staticClass:"hljs-keyword"},["this"]),".$message({\n            ",s._h("span",{staticClass:"hljs-attr"},["type"]),": ",s._h("span",{staticClass:"hljs-string"},["'info'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["message"]),": ",s._h("span",{staticClass:"hljs-string"},["'Delete canceled'"]),"\n          });          \n        });\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(6),s._m(7),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-button type="text" @click="open3">Click to open Message Box</el-button>\n</template>\n\n\n',script:"\n  export default {\n    methods: {\n      open3() {\n        this.$prompt('Please input your e-mail', 'Tip', {\n          confirmButtonText: 'OK',\n          cancelButtonText: 'Cancel',\n          inputPattern: /[\\w!#$%&'*+/=?^_`{|}~-]+(?:\\.[\\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\\w](?:[\\w-]*[\\w])?\\.)+[\\w](?:[\\w-]*[\\w])?/,\n          inputErrorMessage: 'Invalid Email'\n        }).then(value => {\n          this.$message({\n            type: 'success',\n            message: 'Your email is:' + value\n          });\n        }).catch(() => {\n          this.$message({\n            type: 'info',\n            message: 'Input canceled'\n          });       \n        });\n      }\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-button",{attrs:{type:"text"},on:{click:s.open3}},["Click to open Message Box"])]]),s._h("p",["Call ",s._h("code",["$prompt"])," method to open a prompt, and it simulates the system's ",s._h("code",["prompt"]),". You can use ",s._h("code",["inputPattern"])," parameter to specify your own RegExp pattern. Use ",s._h("code",["inputValidator"])," to specify validation method, and it should return ",s._h("code",["Boolean"])," or ",s._h("code",["String"]),". Returning ",s._h("code",["false"])," or ",s._h("code",["String"])," means the validation has failed, and the string returned will be used as the ",s._h("code",["inputErrorMessage"]),". In addition, you can customize the placeholder of the input box with ",s._h("code",["inputPlaceholder"])," parameter."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"text"'])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"open3"']),">"]),"Click to open Message Box",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:
},function(){var s=this;return s._h("h3",{attrs:{id:"types"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#types","aria-hidden":"true"}},["¶"])," Types"])},function(){var s=this;return s._h("p",["Used to show the feedback of Success, Warning, Message and Error activities."])},function(){var s=this;return s._h("h3",{attrs:{id:"closable"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#closable","aria-hidden":"true"}},["¶"])," Closable"])},function(){var s=this;return s._h("p",["A close button can be added."])},function(){var s=this;return s._h("h3",{attrs:{id:"global-method"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#global-method","aria-hidden":"true"}},["¶"])," Global method"])},function(){var s=this;return s._h("p",["Element has added a global method ",s._h("code",["$message"])," for Vue.prototype. So in a vue instance you can call ",s._h("code",["Message"])," like what we did in this page."])},function(){var s=this;return s._h("h3",{attrs:{id:"local-import"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#local-import","aria-hidden":"true"}},["¶"])," Local import"])},function(){var s=this;return s._h("p",["Import ",s._h("code",["Message"]),":"])},function(){var s=this;return s._h("pre",[s._h("code",{staticClass:"hljs language-javascript"},[s._h("span",{staticClass:"hljs-keyword"},["import"])," { Message } ",s._h("span",{staticClass:"hljs-keyword"},["from"])," ",s._h("span",{staticClass:"hljs-string"},["'element-ui'"]),";\n"])])},function(){var s=this;return s._h("p",["In this case you should call ",s._h("code",["Message(options)"]),". We have also registered methods for different types, e.g. ",s._h("code",["Message.success(options)"]),"."])},function(){var s=this;return s._h("h3",{attrs:{id:"options"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#options","aria-hidden":"true"}},["¶"])," Options"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["Attribute"]),s._h("th",["Description"]),s._h("th",["Type"]),s._h("th",["Accepted Values"]),s._h("th",["Default"])])]),s._h("tbody",[s._h("tr",[s._h("td",["message"]),s._h("td",["message text"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["type"]),s._h("td",["message type"]),s._h("td",["string"]),s._h("td",["success/warning/info/error"]),s._h("td",["info"])]),s._h("tr",[s._h("td",["duration"]),s._h("td",["display duration, millisecond. If set to 0, it will not turn off automatically"]),s._h("td",["number"]),s._h("td",["—"]),s._h("td",["3000"])]),s._h("tr",[s._h("td",["showClose"]),s._h("td",["whether to show a close button"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])]),s._h("tr",[s._h("td",["onClose"]),s._h("td",["callback function when closed with the message instance as the parameter"]),s._h("td",["function"]),s._h("td",["—"]),s._h("td",["—"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"methods"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#methods","aria-hidden":"true"}},["¶"])," Methods"])},function(){var s=this;return s._h("p",[s._h("code",["Message"])," and ",s._h("code",["this.$message"])," returns the current Message instance. To manually close the instance, you can call ",s._h("code",["close"])," on it."])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["Method"]),s._h("th",["Description"])])]),s._h("tbody",[s._h("tr",[s._h("td",["close"]),s._h("td",["close the Message"])])])])}]}},function(s,t,a){s.exports=a(155)},function(s,t,a){var n,l;n=a(156);var e=a(157);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){"use strict";s.exports={methods:{open:function(){this.$notify({title:"Title",message:"This is a reminder"})},open2:function(){this.$notify({title:"Prompt",message:"This is a message that does not automatically close",duration:0})},open3:function(){this.$notify({title:"Success
},['"100"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["layout"]),"=",s._h("span",{staticClass:"hljs-string"},['"total, prev, pager, next"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":total"]),"=",s._h("span",{staticClass:"hljs-string"},['"1000"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-pagination"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"block"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demonstration"']),">"]),"Change page size",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-pagination"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["@size-change"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleSizeChange"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["@current-change"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleCurrentChange"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":current-page"]),"=",s._h("span",{staticClass:"hljs-string"},['"currentPage2"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":page-sizes"]),"=",s._h("span",{staticClass:"hljs-string"},['"[100, 200, 300, 400]"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":page-size"]),"=",s._h("span",{staticClass:"hljs-string"},['"100"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["layout"]),"=",s._h("span",{staticClass:"hljs-string"},['"sizes, prev, pager, next"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":total"]),"=",s._h("span",{staticClass:"hljs-string"},['"1000"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-pagination"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"block"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demonstration"']),">"]),"Jump to",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-pagination"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["@size-change"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleSizeChange"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["@current-change"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleCurrentChange"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":current-page"]),"=",s._h("span",{staticClass:"hljs-string"},['"currentPage3"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":page-size"]),"=",s._h("span",{staticClass:"hljs-string"},['"100"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["layout"]),"=",s._h("span",{staticClass:"hljs-string"},['"prev, pager, next, jumper"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":total"]),"=",s._h("span",{staticClass:"hljs-string"},['"1000"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-pagination"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["clas
attrs:{href:"https://github.com/element-component/vue-popper"}},["Vue-popper"])]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["true"])]),s._h("tr",[s._h("td",["options"]),s._h("td",["parameters for ",s._h("a",{attrs:{href:"https://popper.js.org/documentation.html"}},["popper.js"])]),s._h("td",["object"]),s._h("td",["please refer to ",s._h("a",{attrs:{href:"https://popper.js.org/documentation.html"}},["popper.js"])]),s._h("td",[s._h("code",["{ boundariesElement: 'body', gpuAcceleration: false }"])])]),s._h("tr",[s._h("td",["popper-class"]),s._h("td",["custom class name for popover"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"slot"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#slot","aria-hidden":"true"}},["¶"])," Slot"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["Name"]),s._h("th",["Description"])])]),s._h("tbody",[s._h("tr",[s._h("td",["—"]),s._h("td",["text content of popover"])]),s._h("tr",[s._h("td",["reference"]),s._h("td",["HTML element that triggers popover"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"events"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#events","aria-hidden":"true"}},["¶"])," Events"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["Event Name"]),s._h("th",["Description"]),s._h("th",["回调参数"])])]),s._h("tbody",[s._h("tr",[s._h("td",["show"]),s._h("td",["triggers when popover shows"]),s._h("td",["-"])]),s._h("tr",[s._h("td",["hide"]),s._h("td",["triggers when popover hides"]),s._h("td",["-"])])])])}]}},function(s,t,a){s.exports=a(167)},function(s,t,a){var n,l,e=a(168);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-progress :percentage="0"></el-progress>\n<el-progress :percentage="70"></el-progress>\n<el-progress :percentage="100" status="success"></el-progress>\n<el-progress :percentage="50" status="exception"></el-progress>\n',script:null,style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-progress",{attrs:{percentage:0}}),s._h("el-progress",{attrs:{percentage:70}}),s._h("el-progress",{attrs:{percentage:100,status:"success"}}),s._h("el-progress",{attrs:{percentage:50,status:"exception"}})]),s._h("p",["Use ",s._h("code",["percentage"])," attribute to set the percentage. It's ",s._h("strong",["required"])," and must be between ",s._h("code",["0-100"]),"."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-progress"])," ",s._h("span",{staticClass:"hljs-attr"},[":percentage"]),"=",s._h("span",{staticClass:"hljs-string"},['"0"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-progress"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-progress"])," ",s._h("span",{staticClass:"hljs-attr"},[":percentage"]),"=",s._h("span",{staticClass:"hljs-string"},['"70"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-progress"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-progress"])," ",s._h("span",{staticClass:"hljs-attr"},[":percentage"]),"=",s._h("span",{staticClass:"hljs-string"},['"100"'])," ",s._h("span",{staticClass:"hljs-attr"},["status"]),"=",s._h("span",{staticClass:"hljs-string"},['"success"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-progress"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-progress"]),"
style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-radio",{directives:[{name:"model",rawName:"v-model",value:s.radio1,expression:"radio1"}],attrs:{disabled:"",label:"disabled"},domProps:{value:s.radio1},on:{input:function(t){s.radio1=t}}},["optionA"]),s._h("el-radio",{directives:[{name:"model",rawName:"v-model",value:s.radio1,expression:"radio1"}],attrs:{disabled:"",label:"selected and disabled"},domProps:{value:s.radio1},on:{input:function(t){s.radio1=t}}},["optionB"])]]),s._h("p",["You just need to add the ",s._h("code",["disabled"])," attribute."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio"])," ",s._h("span",{staticClass:"hljs-attr"},["disabled"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"radio1"'])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"disabled"']),">"]),"optionA",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-radio"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio"])," ",s._h("span",{staticClass:"hljs-attr"},["disabled"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"radio1"'])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"selected and disabled"']),">"]),"optionB",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-radio"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data () {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["radio1"]),": ",s._h("span",{staticClass:"hljs-string"},["'selected and disabled'"]),"\n      };\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(6),s._m(7),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-radio-group v-model="radio2">\n  <el-radio :label="3">optionA</el-radio>\n  <el-radio :label="6">optionB</el-radio>\n  <el-radio :label="9">optionC</el-radio>\n</el-radio-group>\n\n\n',script:"\n  export default {\n    data () {\n      return {\n        radio2: 3\n      };\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-radio-group",{directives:[{name:"model",rawName:"v-model",value:s.radio2,expression:"radio2"}],domProps:{value:s.radio2},on:{input:function(t){s.radio2=t}}},[s._h("el-radio",{attrs:{label:3}},["optionA"]),s._h("el-radio",{attrs:{label:6}},["optionB"]),s._h("el-radio",{attrs:{label:9}},["optionC"])])]),s._h("p",["Combine ",s._h("code",["<el-radio-group>"])," with ",s._h("code",["<el-radio>"])," to display a radio group. Bind a variable with ",s._h("code",["v-model"])," of ",s._h("code",["<el-radio-group>"])," element and set label value in ",s._h("code",["<el-radio>"]),". It also provides ",s._h("code",["change"])," event with the current value as its parameter."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio-group"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"radio2"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio"]),"
},{value:"Chengdu",label:"Chengdu"},{value:"Shenzhen",label:"Shenzhen"},{value:"Guangzhou",label:"Guangzhou"}],value:"",value2:"",value3:"",value4:"",value5:[],value6:"",value7:"",value8:"",value9:[],value10:[],loading:!1,states:["Alabama","Alaska","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois","Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland","Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana","Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York","North Carolina","North Dakota","Ohio","Oklahoma","Oregon","Pennsylvania","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]}},mounted:function(){this.list=this.states.map(function(s){return{value:s,label:s}})},methods:{remoteMethod:function(s){var t=this;""!==s?(this.loading=!0,setTimeout(function(){t.loading=!1,t.options4=t.list.filter(function(t){return t.label.toLowerCase().indexOf(s.toLowerCase())>-1})},200)):this.options4=[]}}}},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-select v-model="value" placeholder="Select">\n    <el-option v-for="item in options" :label="item.label" :value="item.value">\n    </el-option>\n  </el-select>\n</template>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        options: [{\n          value: 'Option1',\n          label: 'Option1'\n        }, {\n          value: 'Option2',\n          label: 'Option2'\n        }, {\n          value: 'Option3',\n          label: 'Option3'\n        }, {\n          value: 'Option4',\n          label: 'Option4'\n        }, {\n          value: 'Option5',\n          label: 'Option5'\n        }],\n        value: ''\n      }\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-select",{directives:[{name:"model",rawName:"v-model",value:s.value,expression:"value"}],attrs:{placeholder:"Select"},domProps:{value:s.value},on:{input:function(t){s.value=t}}},[s._l(s.options,function(t){return s._h("el-option",{attrs:{label:t.label},domProps:{value:t.value}})})])]]),s._h("p",[s._h("code",["v-model"])," is the value of ",s._h("code",["el-option"])," that is currently selected."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-select"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value"'])," ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"Select"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-option"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["v-for"]),"=",s._h("span",{staticClass:"hljs-string"},['"item in options"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":label"]),"=",s._h("span",{staticClass:"hljs-string"},['"item.label"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":value"]),"=",s._h("span",{staticClass:"hljs-string"},['"item.value"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-option"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-select"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span"
directives:[{name:"model",rawName:"v-model",value:s.value7,expression:"value7"}],attrs:{placeholder:"Select"},domProps:{value:s.value7},on:{input:function(t){s.value7=t}}},[s._l(s.options3,function(t){return s._h("el-option-group",{attrs:{label:t.label}},[s._l(t.options,function(t){return s._h("el-option",{attrs:{label:t.label},domProps:{value:t.value}})})])})])]]),s._h("p",["Use ",s._h("code",["el-option-group"])," to group the options, and its ",s._h("code",["label"])," attribute stands for the name of the group."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-select"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value7"'])," ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"Select"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-option-group"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["v-for"]),"=",s._h("span",{staticClass:"hljs-string"},['"group in options3"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":label"]),"=",s._h("span",{staticClass:"hljs-string"},['"group.label"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-option"]),"\n        ",s._h("span",{staticClass:"hljs-attr"},["v-for"]),"=",s._h("span",{staticClass:"hljs-string"},['"item in group.options"']),"\n        ",s._h("span",{staticClass:"hljs-attr"},[":label"]),"=",s._h("span",{staticClass:"hljs-string"},['"item.label"']),"\n        ",s._h("span",{staticClass:"hljs-attr"},[":value"]),"=",s._h("span",{staticClass:"hljs-string"},['"item.value"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-option"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-option-group"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-select"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["options3"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'Popular cities'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["options"]),": [{\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["'Shanghai'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'Shanghai'"]),"\n          }, {\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["'Beijing'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'Beijing'"]),"\n          }]\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'City name'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["options"]),": [{\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["'Chengdu'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'Chengdu'"]),"\n          }, {\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s.
attrs:{id:"option-attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#option-attributes","aria-hidden":"true"}},["¶"])," Option Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["Attribute"]),s._h("th",["Description"]),s._h("th",["Type"]),s._h("th",["Accepted Values"]),s._h("th",["Default"])])]),s._h("tbody",[s._h("tr",[s._h("td",["value"]),s._h("td",["value of option"]),s._h("td",["string/number/object"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["label"]),s._h("td",["label of option, same as ",s._h("code",["value"])," if omitted"]),s._h("td",["string/number"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["disabled"]),s._h("td",["whether option is disabled"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])])])])}]}},function(s,t,a){s.exports=a(185)},function(s,t,a){var n,l;n=a(186);var e=a(187);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){"use strict";t.__esModule=!0,t.default={data:function(){return{value1:0,value2:50,value3:42,value4:0,value5:0,value6:0}}}},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._m(3),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <div class="block">\n    <span class="demonstration">Default value</span>\n    <el-slider v-model="value1"></el-slider>  \n  </div>\n  <div class="block">\n    <span class="demonstration">Customized initial value</span>\n    <el-slider v-model="value2"></el-slider>\n  </div>\n  <div class="block">\n    <span class="demonstration">Disabled</span>\n    <el-slider v-model="value3" disabled></el-slider>\n  </div>\n</template>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        value1: 0,\n        value2: 50,\n        value3: 42\n      }\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["Default value"]),s._h("el-slider",{directives:[{name:"model",rawName:"v-model",value:s.value1,expression:"value1"}],domProps:{value:s.value1},on:{input:function(t){s.value1=t}}})]),s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["Customized initial value"]),s._h("el-slider",{directives:[{name:"model",rawName:"v-model",value:s.value2,expression:"value2"}],domProps:{value:s.value2},on:{input:function(t){s.value2=t}}})]),s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["Disabled"]),s._h("el-slider",{directives:[{name:"model",rawName:"v-model",value:s.value3,expression:"value3"}],attrs:{disabled:""},domProps:{value:s.value3},on:{input:function(t){s.value3=t}}})])]]),s._h("p",["Customize the initial value of the slider by setting the binding value."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"block"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demonstration"']),">"]),"Default value",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-slider"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value1"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-slider"]),">"]),"  \n  ",s._h("span"
var s=this;return s._h("h2",{attrs:{id:"steps"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#steps","aria-hidden":"true"}},["¶"])," Steps"])},function(){var s=this;return s._h("p",["Guide the user to complete tasks in accordance with the process. Its steps can be set according to the actual application scenario and the number of the steps can't be less than 2."])},function(){var s=this;return s._h("h3",{attrs:{id:"basic-usage"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#basic-usage","aria-hidden":"true"}},["¶"])," Basic usage"])},function(){var s=this;return s._h("p",["Simple step bar."])},function(){var s=this;return s._h("h3",{attrs:{id:"step-bar-that-contains-status"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#step-bar-that-contains-status","aria-hidden":"true"}},["¶"])," Step bar that contains status"])},function(){var s=this;return s._h("p",["Shows the status of the step for each step."])},function(){var s=this;return s._h("h3",{attrs:{id:"step-bar-with-description"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#step-bar-with-description","aria-hidden":"true"}},["¶"])," Step bar with description"])},function(){var s=this;return s._h("p",["There is description for each step."])},function(){var s=this;return s._h("h3",{attrs:{id:"step-bar-with-icon"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#step-bar-with-icon","aria-hidden":"true"}},["¶"])," Step bar with icon"])},function(){var s=this;return s._h("p",["A variety of custom icons can be used in the step bar."])},function(){var s=this;return s._h("h3",{attrs:{id:"vertical-step-bar"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#vertical-step-bar","aria-hidden":"true"}},["¶"])," Vertical step bar"])},function(){var s=this;return s._h("p",["Vertical step bars."])},function(){var s=this;return s._h("h3",{attrs:{id:"steps-attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#steps-attributes","aria-hidden":"true"}},["¶"])," Steps Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["Attribute"]),s._h("th",["Description"]),s._h("th",["Type"]),s._h("th",["Accepted Values"]),s._h("th",["Default"])])]),s._h("tbody",[s._h("tr",[s._h("td",["space"]),s._h("td",["the spacing of each step, will be responsive if omitted"]),s._h("td",["Number"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["direction"]),s._h("td",["display direction"]),s._h("td",["string"]),s._h("td",["vertical/horizontal"]),s._h("td",["horizontal"])]),s._h("tr",[s._h("td",["active"]),s._h("td",["current activation step"]),s._h("td",["number"]),s._h("td",["—"]),s._h("td",["0"])]),s._h("tr",[s._h("td",["process-status"]),s._h("td",["status of current step"]),s._h("td",["string"]),s._h("td",["wait/process/finish/error/success"]),s._h("td",["process"])]),s._h("tr",[s._h("td",["finish-status"]),s._h("td",["status of end step"]),s._h("td",["string"]),s._h("td",["wait/process/finish/error/success"]),s._h("td",["finish"])]),s._h("tr",[s._h("td",["align-center"]),s._h("td",["whether step description is centered"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"step-attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#step-attributes","aria-hidden":"true"}},["¶"])," Step Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["Attribute"]),s._h("th",["Description"]),s._h("th",["Type"]),s._h("th",["Accepted Values"]),s._h("th",["Default"])])]),s._h("tbody",[s._h("tr",[s._h("td",["title"]),s._h("td",["step title"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["description"]),s._h("td",["step description"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["icon"]),s._h("td",["step icon"]),s._h("td",["icons provided by Element Icon. Can be overwritten by a named slot if you want to use ",s._h("br")," custom icons"]),s._h("td",["string"]),s._h("td",["<EFBFBD><EFBFBD>
},['"180"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"name"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Name"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"180"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"address"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Address"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["tableData"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-03'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'Tom'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No. 189, Grove St, Los Angeles'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-02'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'Tom'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No. 189, Grove St, Los Angeles'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-04'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'Tom'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No. 189, Grove St, Los Angeles'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-01'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'Tom'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No. 189, Grove St, Los Angeles'"]),"\n        }]\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(7),s._m(8),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-table :data="tableData2" style="width: 100%" :row-class-name="tableRowClassName">\n    <el-table-column prop="date" label="Date" width="180">\n    </el-table-column>\n    <el-table-column prop="name" label="Name" width="180">\n    </el-table-column>\n    <el-table-column prop="address" label="Address">\n    </el-table-column>\n  </el-table>\n</template>\n\n\n\n\n',script:"\n  export default {\n    met
},["tag"]),": ",s._h("span",{staticClass:"hljs-string"},["'Office'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-04'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'Tom'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["state"]),": ",s._h("span",{staticClass:"hljs-string"},["'California'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["city"]),": ",s._h("span",{staticClass:"hljs-string"},["'Los Angeles'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No. 189, Grove St, Los Angeles'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["zip"]),": ",s._h("span",{staticClass:"hljs-string"},["'CA 90036'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["tag"]),": ",s._h("span",{staticClass:"hljs-string"},["'Home'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-01'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'Tom'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["state"]),": ",s._h("span",{staticClass:"hljs-string"},["'California'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["city"]),": ",s._h("span",{staticClass:"hljs-string"},["'Los Angeles'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No. 189, Grove St, Los Angeles'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["zip"]),": ",s._h("span",{staticClass:"hljs-string"},["'CA 90036'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["tag"]),": ",s._h("span",{staticClass:"hljs-string"},["'Office'"]),"\n        }]\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(13),s._m(14),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-table :data="tableData3" border style="width: 100%" height="250">\n    <el-table-column fixed prop="date" label="Date" width="150">\n    </el-table-column>\n    <el-table-column prop="name" label="Name" width="120">\n    </el-table-column>\n    <el-table-column prop="state" label="State" width="120">\n    </el-table-column>\n    <el-table-column prop="city" label="City" width="120">\n    </el-table-column>\n    <el-table-column prop="address" label="Address" width="300">\n    </el-table-column>\n    <el-table-column prop="zip" label="Zip" width="120">\n    </el-table-column>\n  </el-table>\n</template>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        tableData3: [{\n          date: '2016-05-03',\n          name: 'Tom',\n          state: 'California',\n          city: 'Los Angeles',\n          address: 'No. 189, Grove St, Los Angeles',\n          zip: 'CA 90036'\n        }, {\n          date: '2016-05-02',\n          name: 'Tom',\n          state: 'California',\n          city: 'Los Angeles',\n          address: 'No. 189, Grove St, Los Angeles',\n          zip: 'CA 90036'\n        }, {\n          date: '2016-05-04',\n          name: 'Tom',\n          state: 'California',\n          city: 'Los Angeles',\n          address: 'No. 189, Grove St, Los Angeles',\n          zip: 'CA 90036'\n        }, {\n          date: '2016-05-01',\n          name: 'Tom',\n          state: 'California',\n          city: 'Los Angeles',\n          address: 'No. 189, Grove St, Los Angeles',\n          zip: 'CA 90036'\n        }, {\n          date: '2016-05-08',\n          name: 'Tom',\n          state: 'California',\n          city: 'Los Angeles',\n          address: 'No. 189, Grove St, Los Angeles',\n          zip: 'CA 90036'\n        }, {\n          date: '2016-05-06',\n          name: 'Tom',\n          state: 'California',\n          city: 'Los Angeles',\n          address: 'No. 189, Grove St, Los Angeles',\n      
slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},[":data"]),"=",s._h("span",{staticClass:"hljs-string"},['"tableData"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["highlight-current-row"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},["@current-change"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleCurrentChange"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["style"]),"=",s._h("span",{staticClass:"hljs-string"},['"width: 100%"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"index"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"50"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["property"]),"=",s._h("span",{staticClass:"hljs-string"},['"date"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Date"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"120"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["property"]),"=",s._h("span",{staticClass:"hljs-string"},['"name"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Name"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"120"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["property"]),"=",s._h("span",{staticClass:"hljs-string"},['"address"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Address"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["tableData"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-03'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'Tom'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No. 189, Grove St, Los Angeles'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-02'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),
staticClass:"hljs-string"},["'2016-05-01'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'Tom'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'No. 189, Grove St, Los Angeles'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["tag"]),": ",s._h("span",{staticClass:"hljs-string"},["'Office'"]),"\n        }]\n      }\n    },\n    ",s._h("span",{staticClass:"hljs-attr"},["methods"]),": {\n      formatter(row, column) {\n        ",s._h("span",{staticClass:"hljs-keyword"},["return"])," row.address;\n      },\n      filterTag(value, row) {\n        ",s._h("span",{staticClass:"hljs-keyword"},["return"])," row.tag === value;\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(25),s._m(26),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-table :data="tableData" border style="width: 100%">\n    <el-table-column inline-template label="Date" width="180">\n      <div>\n        <el-icon name="time"></el-icon>\n        <span style="margin-left: 10px">{{ row.date }}</span>\n      </div>\n    </el-table-column>\n    <el-table-column inline-template label="Name" width="180">\n      <el-popover trigger="hover" placement="top">\n        <p>Name: {{ row.name }}</p>\n        <p>Addr: {{ row.address }}</p>\n        <div slot="reference" class="name-wrapper">\n          <el-tag>{{ row.name }}</el-tag>\n        </div>\n      </el-popover>\n    </el-table-column>\n    <el-table-column :context="_self" inline-template label="Operations">\n      <div>\n        <el-button size="small" @click="handleEdit($index, row)">\n          Edit\n        </el-button>\n        <el-button size="small" type="danger" @click="handleDelete($index, row)">\n          Delete\n        </el-button>\n      </div>\n    </el-table-column>\n  </el-table>\n</template>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        tableData: [{\n          date: '2016-05-03',\n          name: 'Tom',\n          address: 'No. 189, Grove St, Los Angeles'\n        }, {\n          date: '2016-05-02',\n          name: 'Tom',\n          address: 'No. 189, Grove St, Los Angeles'\n        }, {\n          date: '2016-05-04',\n          name: 'Tom',\n          address: 'No. 189, Grove St, Los Angeles'\n        }, {\n          date: '2016-05-01',\n          name: 'Tom',\n          address: 'No. 189, Grove St, Los Angeles'\n        }]\n      }\n    },\n    methods: {\n      handleEdit(index, row) {\n        console.log(index, row);\n      },\n      handleDelete(index, row) {\n        console.log(index, row);\n      }\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-table",{staticStyle:{width:"100%"},attrs:{data:s.tableData,border:""}},[s._h("el-table-column",{attrs:{label:"Date",width:"180"},inlineTemplate:{render:function(){var s=this;return s._h("div",[s._h("el-icon",{attrs:{name:"time"}}),s._h("span",{staticStyle:{"margin-left":"10px"}},[s._s(s.row.date)])])},staticRenderFns:[]}}),s._h("el-table-column",{attrs:{label:"Name",width:"180"},inlineTemplate:{render:function(){var s=this;return s._h("el-popover",{attrs:{trigger:"hover",placement:"top"}},[s._h("p",["Name: "+s._s(s.row.name)]),s._h("p",["Addr: "+s._s(s.row.address)]),s._h("div",{slot:"reference",staticClass:"name-wrapper"},[s._h("el-tag",[s._s(s.row.name)])])])},staticRenderFns:[]}}),s._h("el-table-column",{attrs:{context:s._self,label:"Operations"},inlineTemplate:{render:function(){var s=this;return s._h("div",[s._h("el-button",{attrs:{size:"small"},on:{click:function(t){s.handleEdit(s.$index,s.row)}}},["\n          Edit\n        "]),s._h("el-button",{attrs:{size:"small",type:"danger"},on:{click:function(t){s.handleDelete(s.$index,s.row)}}},["\n          Delete\n        "])])},staticRenderFns:[]}})])]]),s._h("p",["Activate custom column template by adding the ",s._h("code",["inline-template"])," attribute. By defau
staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tab-pane"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Role"'])," ",s._h("span",{staticClass:"hljs-attr"},["name"]),"=",s._h("span",{staticClass:"hljs-string"},['"third"']),">"]),"Role",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tab-pane"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tab-pane"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Task"'])," ",s._h("span",{staticClass:"hljs-attr"},["name"]),"=",s._h("span",{staticClass:"hljs-string"},['"fourth"']),">"]),"Task",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tab-pane"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tabs"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["activeName"]),": ",s._h("span",{staticClass:"hljs-string"},["'first'"]),"\n      };\n    }\n  };\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(4),s._m(5),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-tabs type="card" @tab-click="handleClick" @tab-remove="handleRemove">\n    <el-tab-pane label="User">User</el-tab-pane>\n    <el-tab-pane label="Config">Config</el-tab-pane>\n    <el-tab-pane label="Role">Role</el-tab-pane>\n    <el-tab-pane label="Task">Task</el-tab-pane>\n  </el-tabs>\n</template>\n\n',script:"\n  export default {\n    methods: {\n      handleRemove(tab) {\n        console.log(tab);\n      },\n      handleClick(tab, event) {\n        console.log(tab, event);\n      }\n    }\n  };\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-tabs",{attrs:{type:"card"},on:{"tab-click":s.handleClick,"tab-remove":s.handleRemove}},[s._h("el-tab-pane",{attrs:{label:"User"}},["User"]),s._h("el-tab-pane",{attrs:{label:"Config"}},["Config"]),s._h("el-tab-pane",{attrs:{label:"Role"}},["Role"]),s._h("el-tab-pane",{attrs:{label:"Task"}},["Task"])])]]),s._h("p",["Set ",s._h("code",["type"])," to ",s._h("code",["card"])," can get a card-styled tab."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tabs"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"card"'])," ",s._h("span",{staticClass:"hljs-attr"},["@tab-click"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleClick"'])," ",s._h("span",{staticClass:"hljs-attr"},["@tab-remove"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleRemove"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tab-pane"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"User"']),">"]),"User",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tab-pane"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tab-pane"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"Config"']),">"]),"Config",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tab
staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["value2"]),": ",s._h("span",{staticClass:"hljs-keyword"},["new"])," ",s._h("span",{staticClass:"hljs-built_in"},["Date"]),"(",s._h("span",{staticClass:"hljs-number"},["2016"]),", ",s._h("span",{staticClass:"hljs-number"},["9"]),", ",s._h("span",{staticClass:"hljs-number"},["10"]),", ",s._h("span",{staticClass:"hljs-number"},["18"]),", ",s._h("span",{staticClass:"hljs-number"},["40"]),")\n      };\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(6),s._m(7),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:"<template>\n  <el-time-select placeholder=\"Start time\" v-model=\"startTime\" :picker-options=\"{\n      start: '08:30',\n      step: '00:15',\n      end: '18:30'\n    }\">\n  </el-time-select>\n  <el-time-select placeholder=\"End time\" v-model=\"endTime\" :picker-options=\"{\n      start: '08:30',\n      step: '00:15',\n      end: '18:30',\n      minTime: startTime\n    }\">\n  </el-time-select>\n</template>\n\n\n",script:"\n  export default {\n    data() {\n      return {\n        startTime: '',\n        endTime: ''\n      };\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-time-select",{directives:[{name:"model",rawName:"v-model",value:s.startTime,expression:"startTime"}],attrs:{placeholder:"Start time","picker-options":{start:"08:30",step:"00:15",end:"18:30"}},domProps:{value:s.startTime},on:{input:function(t){s.startTime=t}}}),s._h("el-time-select",{directives:[{name:"model",rawName:"v-model",value:s.endTime,expression:"endTime"}],attrs:{placeholder:"End time","picker-options":{start:"08:30",step:"00:15",end:"18:30",minTime:s.startTime}},domProps:{value:s.endTime},on:{input:function(t){s.endTime=t}}})]]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-time-select"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"Start time"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"startTime"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},[":picker-options"]),"=",s._h("span",{staticClass:"hljs-string"},["\"{\n      start: '08:30',\n      step: '00:15',\n      end: '18:30'\n    }\""]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-time-select"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-time-select"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"End time"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"endTime"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},[":picker-options"]),"=",s._h("span",{staticClass:"hljs-string"},["\"{\n      start: '08:30',\n      step: '00:15',\n      end: '18:30',\n      minTime: startTime\n    }\""]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-time-select"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n       
}},[s._h("el-button",["Dark"])]),s._h("el-tooltip",{attrs:{content:"Bottom center",placement:"bottom",effect:"light"}},[s._h("el-button",["Light"])])]),s._h("p",["Set ",s._h("code",["effect"])," to modify theme, and the default value is ",s._h("code",["dark"]),"."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tooltip"])," ",s._h("span",{staticClass:"hljs-attr"},["content"]),"=",s._h("span",{staticClass:"hljs-string"},['"Top center"'])," ",s._h("span",{staticClass:"hljs-attr"},["placement"]),"=",s._h("span",{staticClass:"hljs-string"},['"top"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"Dark",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tooltip"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tooltip"])," ",s._h("span",{staticClass:"hljs-attr"},["content"]),"=",s._h("span",{staticClass:"hljs-string"},['"Bottom center"'])," ",s._h("span",{staticClass:"hljs-attr"},["placement"]),"=",s._h("span",{staticClass:"hljs-string"},['"bottom"'])," ",s._h("span",{staticClass:"hljs-attr"},["effect"]),"=",s._h("span",{staticClass:"hljs-string"},['"light"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"Light",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tooltip"]),">"]),"\n"])])])]),s._m(6),s._m(7),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-tooltip placement="top">\n  <div slot="content">multiple lines<br>second line</div>\n  <el-button>Top center</el-button>\n</el-tooltip>\n',script:null,style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-tooltip",{attrs:{placement:"top"}},[s._h("div",{slot:"content"},["multiple lines",s._h("br"),"second line"]),s._h("el-button",["Top center"])])]),s._h("p",["Override attribute ",s._h("code",["content"])," of ",s._h("code",["el-tooltip"])," by adding a slot named ",s._h("code",["content"]),"."]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tooltip"])," ",s._h("span",{staticClass:"hljs-attr"},["placement"]),"=",s._h("span",{staticClass:"hljs-string"},['"top"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["slot"]),"=",s._h("span",{staticClass:"hljs-string"},['"content"']),">"]),"multiple lines",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["br"]),"/>"]),"second line",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"Top center",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tooltip"]),">"]),"\n"])])])]),s._m(8),s._m(9),s._m(10),s._m(11),s._m(12),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-tooltip :disabled="disabled" content="click to close tooltip function" placement="bottom" effect="light">\n    <el-button @click="disabled=true">click to close tooltip function</el-button>\n  </el-tooltip>\n</template>\n\n\n',script:null,style:"\n  .slide-fade-enter-active {\n    transition: all .3s ease;\n  }\n  .slide-fade-leave-active {\n    transition: all .3s cubic-bezier(1.0, 0.5, 0.8, 1.0);\n  }\n  .slide-fade-enter
l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){s.exports={render:function(){var s=this;return s._m(0)},staticRenderFns:[function(){var s=this;return s._h("section",[s._h("h2",{attrs:{id:"typography"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#typography","aria-hidden":"true"}},["¶"])," Typography"]),s._h("p",["We create a font convention to ensure the best presentation across different platforms."]),s._h("h3",{attrs:{id:"chinese-font"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#chinese-font","aria-hidden":"true"}},["¶"])," Chinese Font"]),s._h("div",{staticClass:"demo-typo-box typo-PingFang"},["\n  和畅惠风\n  ",s._h("div",{staticClass:"name"},["PingFang SC"])]),s._h("div",{staticClass:"demo-typo-box typo-Hiragino"},["\n  和畅惠风\n  ",s._h("div",{staticClass:"name"},["Hiragino Sans GB"])]),s._h("div",{staticClass:"demo-typo-box typo-Microsoft"},["\n  和畅惠风\n  ",s._h("div",{staticClass:"name"},["Microsoft YaHei"])]),s._h("h3",{attrs:{id:"english-numberic-font"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#english-numberic-font","aria-hidden":"true"}},["¶"])," English / Numberic Font"]),s._h("div",{staticClass:"demo-typo-box typo-Helvetica-neue"},["\n  RGag\n  ",s._h("div",{staticClass:"name"},["Helvetica Neue"])]),s._h("div",{staticClass:"demo-typo-box typo-Helvetica"},["\n  RGag\n  ",s._h("div",{staticClass:"name"},["Helvetica"])]),s._h("div",{staticClass:"demo-typo-box typo-Arial"},["\n  RGag\n  ",s._h("div",{staticClass:"name"},["Arial"])]),s._h("h3",{attrs:{id:"font-family"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#font-family","aria-hidden":"true"}},["¶"])," Font-family"]),s._h("pre",[s._h("code",{staticClass:"hljs language-css"},[s._h("span",{staticClass:"hljs-selector-tag"},["font-family"]),': "',s._h("span",{staticClass:"hljs-selector-tag"},["Helvetica"])," ",s._h("span",{staticClass:"hljs-selector-tag"},["Neue"]),'",',s._h("span",{staticClass:"hljs-selector-tag"},["Helvetica"]),',"',s._h("span",{staticClass:"hljs-selector-tag"},["PingFang"])," ",s._h("span",{staticClass:"hljs-selector-tag"},["SC"]),'","',s._h("span",{staticClass:"hljs-selector-tag"},["Hiragino"])," ",s._h("span",{staticClass:"hljs-selector-tag"},["Sans"])," ",s._h("span",{staticClass:"hljs-selector-tag"},["GB"]),'","',s._h("span",{staticClass:"hljs-selector-tag"},["Microsoft"])," ",s._h("span",{staticClass:"hljs-selector-tag"},["YaHei"]),'","微软雅黑",',s._h("span",{staticClass:"hljs-selector-tag"},["Arial"]),",",s._h("span",{staticClass:"hljs-selector-tag"},["sans-serif"]),";\n"])]),s._h("h3",{attrs:{id:"font-convention"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#font-convention","aria-hidden":"true"}},["¶"])," Font Convention"]),s._h("table",{staticClass:"demo-typo-size"},[s._h("tbody",[s._h("tr",[s._h("td",{staticClass:"h1"},["Main Title"]),s._h("td",{staticClass:"h1"},["Build with Element"]),s._h("td",{staticClass:"color-dark-light"},["20px  Extra large"])]),s._h("tr",[s._h("td",{staticClass:"h2"},["Title"]),s._h("td",{staticClass:"h2"},["Build with Element"]),s._h("td",{staticClass:"color-dark-light"},["18px large"])]),s._h("tr",[s._h("td",{staticClass:"h3"},["Small Title"]),s._h("td",{staticClass:"h3"},["Build with Element"]),s._h("td",{staticClass:"color-dark-light"},["16px Medium"])]),s._h("tr",[s._h("td",{staticClass:"text-regular"},["Body"]),s._h("td",{staticClass:"text-regular"},["Build with Element"]),s._h("td",{staticClass:"color-dark-light"},["14px Small"])]),s._h("tr",[s._h("td",{staticClass:"text-small"},["Body (small)"]),s._h("td",{staticClass:"text-small"},["Build with Element"]),s._h("td",{staticClass:"color-dark-light"},["13px Extra Small"])]),s._h("tr",[s._h("td",{staticClass:"text-smaller"},["Supplementary text"]),s._h("td",{staticClass:"text-smaller"},["Build with Element"]),s._h("td",{staticClass:"color-dark-light"},["12px Extra Extra Small"])])])])])}]}},function(s,t,a){s.exports=a(228)},function(s,t,a){var n,l;n=a(229);var e=a(230);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"
},["<",s._h("span",{staticClass:"hljs-name"},["el-alert"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},["title"]),"=",s._h("span",{staticClass:"hljs-string"},['"自定义 close-text"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"info"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["close-text"]),"=",s._h("span",{staticClass:"hljs-string"},['"知道了"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-alert"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-alert"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},["title"]),"=",s._h("span",{staticClass:"hljs-string"},['"设置了回调的 alert"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"warning"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["@close"]),"=",s._h("span",{staticClass:"hljs-string"},['"hello"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-alert"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    ",s._h("span",{staticClass:"hljs-attr"},["methods"]),": {\n      hello() {\n        alert(",s._h("span",{staticClass:"hljs-string"},["'Hello World!'"]),");\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(6),s._m(7),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-alert title="成功提示的文案" type="success" show-icon>\n  </el-alert>\n  <el-alert title="消息提示的文案" type="info" show-icon>\n  </el-alert>\n  <el-alert title="警告提示的文案" type="warning" show-icon>\n  </el-alert>\n  <el-alert title="错误提示的文案" type="error" show-icon>\n  </el-alert>\n</template>\n',script:null,style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-alert",{attrs:{title:"成功提示的文案",type:"success","show-icon":""}}),s._h("el-alert",{attrs:{title:"消息提示的文案",type:"info","show-icon":""}}),s._h("el-alert",{attrs:{title:"警告提示的文案",type:"warning","show-icon":""}}),s._h("el-alert",{attrs:{title:"错误提示的文案",type:"error","show-icon":""}})]]),s._h("p",["通过设置",s._h("code",["show-icon"]),"属性来显示 Alert 的 icon，这能更有效地向用户展示你的显示意图。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-alert"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},["title"]),"=",s._h("span",{staticClass:"hljs-string"},['"成功提示的文案"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"success"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["show-icon"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-alert"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-alert"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},["title"]),"=",s._h("span",{staticClass:"hljs-string"},['"消息提示的文案"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"info"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["show-icon"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-alert"]),">"]),"\n  ",s._h("span",{staticClass:"hlj
staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-breadcrumb separator="/">\n  <el-breadcrumb-item :to="{ path: \'/\' }">首页</el-breadcrumb-item>\n  <el-breadcrumb-item>活动管理</el-breadcrumb-item>\n  <el-breadcrumb-item>活动列表</el-breadcrumb-item>\n  <el-breadcrumb-item>活动详情</el-breadcrumb-item>\n</el-breadcrumb>\n',script:null,style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-breadcrumb",{attrs:{separator:"/"}},[s._h("el-breadcrumb-item",{attrs:{to:{path:"/"}}},["首页"]),s._h("el-breadcrumb-item",["活动管理"]),s._h("el-breadcrumb-item",["活动列表"]),s._h("el-breadcrumb-item",["活动详情"])])]),s._h("p",["在",s._h("code",["el-breadcrumb"]),"中使用",s._h("code",["el-breadcrumb-item"]),"标签表示从首页开始的每一级。Element 提供了一个",s._h("code",["separator"]),"属性，在",s._h("code",["el-breadcrumb"]),"标签中设置它来决定分隔符，它只能是字符串，默认为斜杠",s._h("code",["/"]),"。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb"])," ",s._h("span",{staticClass:"hljs-attr"},["separator"]),"=",s._h("span",{staticClass:"hljs-string"},['"/"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb-item"])," ",s._h("span",{staticClass:"hljs-attr"},[":to"]),"=",s._h("span",{staticClass:"hljs-string"},["\"{ path: '/' }\""]),">"]),"首页",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb-item"]),">"]),"活动管理",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb-item"]),">"]),"活动列表",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb-item"]),">"]),"活动详情",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb-item"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-breadcrumb"]),">"]),"\n"])])])]),s._m(4),s._m(5),s._m(6),s._m(7)])},staticRenderFns:[function(){var s=this;return s._h("h2",{attrs:{id:"breadcrumb-mian-bao-xie"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#breadcrumb-mian-bao-xie","aria-hidden":"true"}},["¶"])," Breadcrumb 面包屑"])},function(){var s=this;return s._h("p",["显示当前页面的路径，快速返回之前的任意页面。"])},function(){var s=this;return s._h("h3",{attrs:{id:"ji-chu-yong-fa"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#ji-chu-yong-fa","aria-hidden":"true"}},["¶"])," 基础用法"])},function(){var s=this;return s._h("p",["适用广泛的基础用法。"])},function(){var s=this;return s._h("h3",{attrs:{id:"breadcrumb-attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#breadcrumb-attributes","aria-hidden":"true"}},["¶"])," Breadcrumb Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["separator"]),s._h("td",["分隔符"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["斜杠'/'"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"breadcrumb-item-attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#breadcrumb-item-attributes","aria-hidden":"true"}},["¶"])," Breadcrumb Item Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h(
},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["style"]),"=",s._h("span",{staticClass:"hljs-string"},['"line-height: 36px;"']),">"]),"卡片名称",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["style"]),"=",s._h("span",{staticClass:"hljs-string"},['"float: right;"'])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"primary"']),">"]),"操作按钮",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["v-for"]),"=",s._h("span",{staticClass:"hljs-string"},['"o in 4"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"text item"']),">"]),"\n    ",s._h("span",["{{"]),"'列表内容 ' + o ",s._h("span",["}}"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-card"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),s._h("span",{staticClass:"css"},["\n  ",s._h("span",{staticClass:"hljs-selector-class"},[".text"])," {\n    ",s._h("span",{staticClass:"hljs-attribute"},["font-size"]),": ",s._h("span",{staticClass:"hljs-number"},["14px"]),";\n  }\n\n  ",s._h("span",{staticClass:"hljs-selector-class"},[".item"])," {\n    ",s._h("span",{staticClass:"hljs-attribute"},["padding"]),": ",s._h("span",{staticClass:"hljs-number"},["18px"])," ",s._h("span",{staticClass:"hljs-number"},["0"]),";\n  }\n\n  ",s._h("span",{staticClass:"hljs-selector-class"},[".clearfix"]),s._h("span",{staticClass:"hljs-selector-pseudo"},[":before"]),",\n  ",s._h("span",{staticClass:"hljs-selector-class"},[".clearfix"]),s._h("span",{staticClass:"hljs-selector-pseudo"},[":after"])," {\n      ",s._h("span",{staticClass:"hljs-attribute"},["display"]),": table;\n      ",s._h("span",{staticClass:"hljs-attribute"},["content"]),": ",s._h("span",{staticClass:"hljs-string"},['""']),";\n  }\n  ",s._h("span",{staticClass:"hljs-selector-class"},[".clearfix"]),s._h("span",{staticClass:"hljs-selector-pseudo"},[":after"])," {\n      ",s._h("span",{staticClass:"hljs-attribute"},["clear"]),": both\n  }\n\n  ",s._h("span",{staticClass:"hljs-selector-class"},[".box-card"])," {\n    ",s._h("span",{staticClass:"hljs-attribute"},["width"]),": ",s._h("span",{staticClass:"hljs-number"},["480px"]),";\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),"\n"])])])]),s._m(4),s._m(5),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-card class="box-card">\n  <div v-for="o in 4" class="text item">\n    {{\'列表内容 \' + o }}\n  </div>\n</el-card>\n\n\n',script:null,style:"\n  .text {\n    font-size: 14px;\n  }\n\n  .item {\n    padding: 18px 0;\n  }\n\n  .box-card {\n    width: 480px;\n  }\n"}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-card",{staticClass:"box-card"},[s._l(4,function(t){return s._h("div",{staticClass:"text item"},["\n    "+s._s("列表内容 "+t)+"\n  "])})])]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-card"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"box-card"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["v-for"]),"=",s._h("span",{static
"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){s.exports={render:function(){var s=this;return s._m(0)},staticRenderFns:[function(){var s=this;return s._h("section",[s._h("h2",{attrs:{id:"zi-ding-yi-zhu-ti"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#zi-ding-yi-zhu-ti","aria-hidden":"true"}},["¶"])," 自定义主题"]),s._h("p",["Element 默认提供一套主题，CSS 命名采用 BEM 的风格方便使用者覆盖样式。如果你想完全替换主题色或者部分样式，可以使用下面方法。"]),s._h("h3",{attrs:{id:"an-zhuang-gong-ju"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#an-zhuang-gong-ju","aria-hidden":"true"}},["¶"])," 安装工具"]),s._h("p",["首先安装「主题生成工具」，可以全局安装或者安装在当前项目下，推荐安装在项目里，方便别人 clone 项目时能直接安装依赖并启动，这里以全局安装做演示。"]),s._h("pre",[s._h("code",{staticClass:"hljs language-shell"},["npm i element-theme -g\n"])]),s._h("p",["安装默认主题，可以从 npm 安装或者从 GitHub 拉取最新代码。"]),s._h("pre",[s._h("code",{staticClass:"hljs language-shell"},["# 从 npm\nnpm i element-theme-default -D\n\n# 从 GitHub\nnpm i https://github.com/ElementUI/theme-default -D\n"])]),s._h("h3",{attrs:{id:"chu-shi-hua-bian-liang-wen-jian"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#chu-shi-hua-bian-liang-wen-jian","aria-hidden":"true"}},["¶"])," 初始化变量文件"]),s._h("p",["主题生成工具安装成功后，如果全局安装可以在命令行里通过 ",s._h("code",["et"])," 调用工具，如果安装在当前目录下，需要通过 ",s._h("code",["node_modules/.bin/et"])," 访问到命令。执行 ",s._h("code",["-i"])," 初始化变量文件。默认输出到 ",s._h("code",["element-variables.css"]),"，当然你可以传参数指定文件输出目录。"]),s._h("pre",[s._h("code",{staticClass:"hljs language-shell"},["et -i [可以自定义变量文件目录]\n\n> ✔ Generator variables file\n"])]),s._h("p",["如果使用默认配置，执行后当前目录会有一个 ",s._h("code",["element-variables.css"])," 文件。内部包含了主题所用到的所有变量，它们使用 CSS4 的风格定义。大致结构如下："]),s._h("pre",[s._h("code",{staticClass:"hljs language-css"},[s._h("span",{staticClass:"hljs-selector-pseudo"},[":root"])," {\n\n  ",s._h("span",{staticClass:"hljs-comment"},["/* Colors\n  -------------------------- */"]),"\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-primary"]),": ",s._h("span",{staticClass:"hljs-number"},["#20a0ff"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-success"]),": ",s._h("span",{staticClass:"hljs-number"},["#13ce66"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-warning"]),": ",s._h("span",{staticClass:"hljs-number"},["#f7ba2a"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-danger"]),": ",s._h("span",{staticClass:"hljs-number"},["#ff4949"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-info"]),": ",s._h("span",{staticClass:"hljs-number"},["#50BFFF"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-blue"]),": ",s._h("span",{staticClass:"hljs-number"},["#2e90fe"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-blue-light"]),": ",s._h("span",{staticClass:"hljs-number"},["#5da9ff"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-blue-lighter"]),": ",s._h("span",{staticClass:"hljs-built_in"},["rgba"]),"(var(--color-blue), ",s._h("span",{staticClass:"hljs-number"},["0.12"]),");\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-white"]),": ",s._h("span",{staticClass:"hljs-number"},["#fff"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-black"]),": ",s._h("span",{staticClass:"hljs-number"},["#000"]),";\n  ",s._h("span",{staticClass:"hljs-attribute"},["--color-grey"]),": ",s._h("span",{staticClass:"hljs-number"},["#C0CCDA"]),";\n"])]),s._h("h3",{attrs:{id:"xiu-gai-bian-lian
staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(8),s._m(9),s._m(10),s._m(11),s._m(12),s._m(13)])},staticRenderFns:[function(){var s=this;return s._h("h2",{attrs:{id:"datepicker-ri-qi-xuan-ze-qi"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#datepicker-ri-qi-xuan-ze-qi","aria-hidden":"true"}},["¶"])," DatePicker 日期选择器"])},function(){var s=this;return s._h("p",["用于选择或输入日期"])},function(){var s=this;return s._h("h3",{attrs:{id:"xuan-ze-ri"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#xuan-ze-ri","aria-hidden":"true"}},["¶"])," 选择日"])},function(){var s=this;return s._h("p",["以「日」为基本单位，基础的日期选择控件"])},function(){var s=this;return s._h("h3",{attrs:{id:"qi-ta-ri-qi-dan-wei"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#qi-ta-ri-qi-dan-wei","aria-hidden":"true"}},["¶"])," 其他日期单位"])},function(){var s=this;return s._h("p",["通过扩展基础的日期选择，可以选择周、月、年"])},function(){var s=this;return s._h("h3",{attrs:{id:"xuan-ze-ri-qi-fan-wei"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#xuan-ze-ri-qi-fan-wei","aria-hidden":"true"}},["¶"])," 选择日期范围"])},function(){var s=this;return s._h("p",["可在一个选择器中便捷地选择一个时间范围"])},function(){var s=this;return s._h("h3",{attrs:{id:"attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#attributes","aria-hidden":"true"}},["¶"])," Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["readonly"]),s._h("td",["完全只读"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])]),s._h("tr",[s._h("td",["disabled"]),s._h("td",["禁用"]),s._h("td",["boolean"]),s._h("td",["-"]),s._h("td",["false"])]),s._h("tr",[s._h("td",["editable"]),s._h("td",["文本框可输入"]),s._h("td",["boolean"]),s._h("td",["-"]),s._h("td",["true"])]),s._h("tr",[s._h("td",["placeholder"]),s._h("td",["占位内容"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["type"]),s._h("td",["显示类型"]),s._h("td",["string"]),s._h("td",["year/month/date/week/",s._h("br"),"datetime/datetimerange/daterange"]),s._h("td",["date"])]),s._h("tr",[s._h("td",["format"]),s._h("td",["时间日期格式化"]),s._h("td",["string"]),s._h("td",["年 ",s._h("code",["yyyy"]),"，月 ",s._h("code",["MM"]),"，日 ",s._h("code",["dd"]),"，",s._h("br"),"小时 ",s._h("code",["HH"]),"，分 ",s._h("code",["mm"]),"，秒 ",s._h("code",["ss"])]),s._h("td",["yyyy-MM-dd"])]),s._h("tr",[s._h("td",["align"]),s._h("td",["对齐方式"]),s._h("td",["string"]),s._h("td",["left, center, right"]),s._h("td",["left"])]),s._h("tr",[s._h("td",["picker-options"]),s._h("td",["当前时间日期选择器特有的选项",s._h("br"),"参考下表"]),s._h("td",["object"]),s._h("td",["—"]),s._h("td",["{}"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"picker-options"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#picker-options","aria-hidden":"true"}},["¶"])," Picker Options"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["shortcuts"]),s._h("td",["设置快捷选项，需要传入 { text, onClick } 对象",s._h("br"),"用法参考 demo 或下表"]),s._h("td",["Object[]"]),s._h("td",["-"]),s._h("td",["-"])]),s._h("tr",[s._h("td",["disabledDate"]),s._h("td",["设置禁用状态，参数为当前日期，要求返回 Boolean"]),s._h("td",["Function"]),s._h("td",["-"]),s._h("td",["-"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"shortcuts"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#shortcuts","aria-hidden":"true"}},["¶"]),
staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["dialogVisible"]),": ",s._h("span",{staticClass:"hljs-literal"},["false"]),"\n      };\n    }\n  };\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(4),s._m(5),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<!-- Table -->\n<el-button type="text" @click="dialogTableVisible = true">打开嵌套表格的 Dialog</el-button>\n\n<el-dialog title="收货地址" v-model="dialogTableVisible">\n  <el-table :data="gridData">\n    <el-table-column property="date" label="日期" width="150"></el-table-column>\n    <el-table-column property="name" label="姓名" width="200"></el-table-column>\n    <el-table-column property="address" label="地址"></el-table-column>\n  </el-table>\n</el-dialog>\n\n<!-- Form -->\n<el-button type="text" @click="dialogFormVisible = true">打开嵌套表单的 Dialog</el-button>\n\n<el-dialog title="收货地址" v-model="dialogFormVisible">\n  <el-form :model="form">\n    <el-form-item label="活动名称" :label-width="formLabelWidth">\n      <el-input v-model="form.name" auto-complete="off"></el-input>\n    </el-form-item>\n    <el-form-item label="活动区域" :label-width="formLabelWidth">\n      <el-select v-model="form.region" placeholder="请选择活动区域">\n        <el-option label="区域一" value="shanghai"></el-option>\n        <el-option label="区域二" value="beijing"></el-option>\n      </el-select>\n    </el-form-item>\n  </el-form>\n  <div slot="footer" class="dialog-footer">\n    <el-button @click="dialogFormVisible = false">取 消</el-button>\n    <el-button type="primary" @click="dialogFormVisible = false">确 定</el-button>\n  </div>\n</el-dialog>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        gridData: [{\n          date: '2016-05-02',\n          name: '王小虎',\n          address: '上海市普陀区金沙江路 1518 弄'\n        }, {\n          date: '2016-05-04',\n          name: '王小虎',\n          address: '上海市普陀区金沙江路 1518 弄'\n        }, {\n          date: '2016-05-01',\n          name: '王小虎',\n          address: '上海市普陀区金沙江路 1518 弄'\n        }, {\n          date: '2016-05-03',\n          name: '王小虎',\n          address: '上海市普陀区金沙江路 1518 弄'\n        }],\n        dialogTableVisible: false,\n        dialogFormVisible: false,\n        form: {\n          name: '',\n          region: '',\n          date1: '',\n          date2: '',\n          delivery: false,\n          type: [],\n          resource: '',\n          desc: ''\n        },\n        formLabelWidth: '120px'\n      };\n    }\n  };\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-button",{attrs:{type:"text"},on:{click:function(t){s.dialogTableVisible=!0}}},["打开嵌套表格的 Dialog"]),s._h("el-dialog",{directives:[{name:"model",rawName:"v-model",value:s.dialogTableVisible,expression:"dialogTableVisible"}],attrs:{title:"收货地址"},domProps:{value:s.dialogTableVisible},on:{input:function(t){s.dialogTableVisible=t}}},[s._h("el-table",{attrs:{data:s.gridData}},[s._h("el-table-column",{attrs:{property:"date",label:"日期",width:"150"}}),s._h("el-table-column",{attrs:{property:"name",label:"姓名",width:"200"}}),s._h("el-table-column",{attrs:{property:"address",label:"地址"}})])]),s._h("el-button",{attrs:{type:"text"},on:{click:function(t){s.dialogFormVisible=!0}}},["打开嵌套表单的 Dialog"]),s._h("el-dialog",{directives:[{name:"model",rawName:"v-model",value:s.dialogFormVisible,expression:"dialogFormVisible"}],attrs:{title:"收货地址"},domProps:{value:s.dialogFormVisible},on:{input:function(t){s.dialogFormVisible=t}}},[s._h("el-form",{attrs:{model:s.form}},[s._h("el-form-item",{attrs:{label:"活动名称","label-width":s.formLabelWidth}},[s._h("el-input",{directives:[{name:"model",rawName:"v-model",value:s.form.name,expression:"form.name"}],attrs:{"auto-complete":"off"},domProps
script:null,style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-row",{staticClass:"block-col-2"},[s._h("el-col",{attrs:{span:12}},[s._h("span",{staticClass:"demonstration"},["hover 激活"]),s._h("el-dropdown",[s._h("span",{staticClass:"el-dropdown-link"},["\n        下拉菜单",s._h("i",{staticClass:"el-icon-caret-bottom el-icon--right"})]),s._h("el-dropdown-menu",{slot:"dropdown"},[s._h("el-dropdown-item",["黄金糕"]),s._h("el-dropdown-item",["狮子头"]),s._h("el-dropdown-item",["螺蛳粉"]),s._h("el-dropdown-item",["双皮奶"]),s._h("el-dropdown-item",["蚵仔煎"])])])]),s._h("el-col",{attrs:{span:12}},[s._h("span",{staticClass:"demonstration"},["click 激活"]),s._h("el-dropdown",{attrs:{trigger:"click"}},[s._h("span",{staticClass:"el-dropdown-link"},["\n        下拉菜单",s._h("i",{staticClass:"el-icon-caret-bottom el-icon--right"})]),s._h("el-dropdown-menu",{slot:"dropdown"},[s._h("el-dropdown-item",["黄金糕"]),s._h("el-dropdown-item",["狮子头"]),s._h("el-dropdown-item",["螺蛳粉"]),s._h("el-dropdown-item",["双皮奶"]),s._h("el-dropdown-item",["蚵仔煎"])])])])])]),s._h("p",["在",s._h("code",["trigger"]),"属性设置为",s._h("code",["click"]),"即可。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-row"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"block-col-2"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"12"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demonstration"']),">"]),"hover 激活",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown"]),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"el-dropdown-link"']),">"]),"\n        下拉菜单",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["i"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"el-icon-caret-bottom el-icon--right"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["i"]),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown-menu"])," ",s._h("span",{staticClass:"hljs-attr"},["slot"]),"=",s._h("span",{staticClass:"hljs-string"},['"dropdown"']),">"]),"\n        ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"]),">"]),"黄金糕",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"]),">"]),"\n        ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"]),">"]),"狮子头",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"]),">"]),"\n        ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"]),">"]),"螺蛳粉",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"]),">"]),"\n        ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"]),">"]),"双皮奶",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-dropdown-item"
},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["form"]),": {\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["region"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["date1"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["date2"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["delivery"]),": ",s._h("span",{staticClass:"hljs-literal"},["false"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["type"]),": [],\n          ",s._h("span",{staticClass:"hljs-attr"},["resource"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["desc"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),"\n        }\n      }\n    },\n    ",s._h("span",{staticClass:"hljs-attr"},["methods"]),": {\n      onSubmit() {\n        ",s._h("span",{staticClass:"hljs-built_in"},["console"]),".log(",s._h("span",{staticClass:"hljs-string"},["'submit!'"]),");\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(4),s._m(5),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-form :inline="true" :model="formInline" class="demo-form-inline">\n  <el-form-item>\n    <el-input v-model="formInline.user" placeholder="审批人"></el-input>\n  </el-form-item><el-form-item>\n    <el-select v-model="formInline.region" placeholder="活动区域">\n      <el-option label="区域一" value="shanghai"></el-option>\n      <el-option label="区域二" value="beijing"></el-option>\n    </el-select>\n  </el-form-item><el-form-item>\n    <el-button type="primary" @click="onSubmit">查询</el-button>\n  </el-form-item>\n</el-form>\n\n',script:"\n  export default {\n    data() {\n      return {\n        formInline: {\n          user: '',\n          region: ''\n        }\n      }\n    },\n    methods: {\n      onSubmit() {\n        console.log('submit!');\n      }\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-form",{staticClass:"demo-form-inline",attrs:{inline:!0,model:s.formInline}},[s._h("el-form-item",[s._h("el-input",{directives:[{name:"model",rawName:"v-model",value:s.formInline.user,expression:"formInline.user"}],attrs:{placeholder:"审批人"},domProps:{value:s.formInline.user},on:{input:function(t){s.formInline.user=t}}})]),s._h("el-form-item",[s._h("el-select",{directives:[{name:"model",rawName:"v-model",value:s.formInline.region,expression:"formInline.region"}],attrs:{placeholder:"活动区域"},domProps:{value:s.formInline.region},on:{input:function(t){s.formInline.region=t}}},[s._h("el-option",{attrs:{label:"区域一",value:"shanghai"}}),s._h("el-option",{attrs:{label:"区域二",value:"beijing"}})])]),s._h("el-form-item",[s._h("el-button",{attrs:{type:"primary"},on:{click:s.onSubmit}},["查询"])])])]),s._h("p",["设置 ",s._h("code",["inline"])," 属性可以让表单域变为行内的表单域"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form"])," ",s._h("span",{staticClass:"hljs-attr"},[":inline"]),"=",s._h("span",{staticClass:"hljs-string"},['"true"'])," ",s._h("span",{staticClass:"hljs-attr"},[":model"]),"=",s._h("span",{staticClass:"hljs-string"},['"formInline"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demo-form-inline"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-input"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{stat
},['"ruleForm.name"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-input"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"活动区域"'])," ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"region"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-select"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"ruleForm.region"'])," ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"请选择活动区域"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-option"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"区域一"'])," ",s._h("span",{staticClass:"hljs-attr"},["value"]),"=",s._h("span",{staticClass:"hljs-string"},['"shanghai"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-option"]),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-option"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"区域二"'])," ",s._h("span",{staticClass:"hljs-attr"},["value"]),"=",s._h("span",{staticClass:"hljs-string"},['"beijing"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-option"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-select"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"活动时间"'])," ",s._h("span",{staticClass:"hljs-attr"},["required"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"11"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-form-item"])," ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"date1"']),">"]),"\n        ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-date-picker"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"date"'])," ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"选择日期"'])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"ruleForm.date1"'])," ",s._h("span",{staticClass:"hljs-attr"},["style"]),"=",s._h("span",{staticClass:"hljs-string"},['"width: 100%;"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-date-picker"]),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-form-item"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"line"'])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"2"']),">"]),"-",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"}
staticClass:"hljs-attr"},["validator"]),": validatePass, ",s._h("span",{staticClass:"hljs-attr"},["trigger"]),": ",s._h("span",{staticClass:"hljs-string"},["'blur'"])," }\n          ],\n          ",s._h("span",{staticClass:"hljs-attr"},["checkPass"]),": [\n            { ",s._h("span",{staticClass:"hljs-attr"},["validator"]),": validatePass2, ",s._h("span",{staticClass:"hljs-attr"},["trigger"]),": ",s._h("span",{staticClass:"hljs-string"},["'blur'"])," }\n          ],\n          ",s._h("span",{staticClass:"hljs-attr"},["age"]),": [\n            { ",s._h("span",{staticClass:"hljs-attr"},["validator"]),": checkAge, ",s._h("span",{staticClass:"hljs-attr"},["trigger"]),": ",s._h("span",{staticClass:"hljs-string"},["'blur'"])," }\n          ]\n        }\n      };\n    },\n    ",s._h("span",{staticClass:"hljs-attr"},["methods"]),": {\n      handleReset2() {\n        ",s._h("span",{staticClass:"hljs-keyword"},["this"]),".$refs.ruleForm2.resetFields();\n      },\n      handleSubmit2(ev) {\n        ",s._h("span",{staticClass:"hljs-keyword"},["this"]),".$refs.ruleForm2.validate(",s._h("span",{staticClass:"hljs-function"},["(",s._h("span",{staticClass:"hljs-params"},["valid"]),") =>"])," {\n          ",s._h("span",{staticClass:"hljs-keyword"},["if"])," (valid) {\n            alert(",s._h("span",{staticClass:"hljs-string"},["'submit!'"]),");\n          } ",s._h("span",{staticClass:"hljs-keyword"},["else"])," {\n            ",s._h("span",{staticClass:"hljs-built_in"},["console"]),".log(",s._h("span",{staticClass:"hljs-string"},["'error submit!!'"]),");\n            ",s._h("span",{staticClass:"hljs-keyword"},["return"])," ",s._h("span",{staticClass:"hljs-literal"},["false"]),";\n          }\n        });\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(14),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-form :model="dynamicForm" :rules="dynamicRule" ref="dynamicForm" label-width="100px" class="demo-dynamic">\n  <el-form-item prop="email" label="邮箱">\n    <el-input v-model="dynamicForm.email"></el-input>\n  </el-form-item>\n  <el-form-item v-for="(domain, index) in dynamicForm.domains" :label="\'域名\' + index" :key="domain.key" :prop="\'domains.\' + index + \'.value\'" :rules="{\n      required: true, message: \'域名不能为空\', trigger: \'blur\'\n    }">\n    <el-input v-model="domain.value"></el-input><el-button @click.prevent="removeDomain(domain)">删除</el-button>\n  </el-form-item>\n  <el-form-item>\n    <el-button type="primary" @click="handleSubmit3">提交</el-button>\n    <el-button @click="addDomain">新增域名</el-button>\n    <el-button @click="handleReset3">重置</el-button>\n  </el-form-item>\n</el-form>\n\n',script:"\n  export default {\n    data() {\n      return {\n        dynamicForm: {\n          domains: [{\n            value: ''\n          }],\n          email: ''\n        },\n        dynamicRule: {\n          email: [\n            { required: true, message: '请输入邮箱地址', trigger: 'blur' },\n            { type: 'email', message: '请输入正确的邮箱地址', trigger: 'blur,change' }\n          ]\n        }\n      };\n    },\n    methods: {\n      handleSubmit3(ev) {\n        this.$refs.ruleForm.validate((valid) => {\n          if (valid) {\n            alert('submit!');\n          } else {\n            console.log('error submit!!');\n            return false;\n          }\n        });\n      },\n      handleReset3() {\n        this.$refs.dynamicForm.resetFields();\n      },\n      removeDomain(item) {\n        var index = this.dynamicForm.domains.indexOf(item)\n        if (index !== -1) {\n          this.dynamicForm.domains.splice(index, 1)\n        }\n      },\n      addDomain() {\n        this.dynamicForm.domains.push({\n          value: '',\n          key: Date.now()\n        });\n      }\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-form",{ref:"dynamicForm",staticClass:"demo-dynamic",attrs:{model:s.dynamicForm,rules:s.dynamicR
},['"num3"'])," ",s._h("span",{staticClass:"hljs-attr"},[":step"]),"=",s._h("span",{staticClass:"hljs-string"},['"2"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-input-number"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["num3"]),": ",s._h("span",{staticClass:"hljs-number"},["5"]),"\n      }\n    }\n  };\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(6),s._m(7),s._m(8),s._m(9)])},staticRenderFns:[function(){var s=this;return s._h("h2",{attrs:{id:"inputnumber-ji-shu-qi"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#inputnumber-ji-shu-qi","aria-hidden":"true"}},["¶"])," InputNumber 计数器"])},function(){var s=this;return s._h("p",["仅允许输入标准的数字值，可定义范围"])},function(){var s=this;return s._h("h3",{attrs:{id:"ji-chu-yong-fa"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#ji-chu-yong-fa","aria-hidden":"true"}},["¶"])," 基础用法"])},function(){var s=this;return s._h("h3",{attrs:{id:"jin-yong-zhuang-tai"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#jin-yong-zhuang-tai","aria-hidden":"true"}},["¶"])," 禁用状态"])},function(){var s=this;return s._h("h3",{attrs:{id:"bu-shu"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#bu-shu","aria-hidden":"true"}},["¶"])," 步数"])},function(){var s=this;return s._h("p",["允许定义递增递减的步数控制"])},function(){var s=this;return s._h("h3",{attrs:{id:"attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#attributes","aria-hidden":"true"}},["¶"])," Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["value"]),s._h("td",["绑定值"]),s._h("td",["number"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["min"]),s._h("td",["设置计数器允许的最小值"]),s._h("td",["number"]),s._h("td",["—"]),s._h("td",["0"])]),s._h("tr",[s._h("td",["max"]),s._h("td",["设置计数器允许的最大值"]),s._h("td",["number"]),s._h("td",["—"]),s._h("td",["Infinity"])]),s._h("tr",[s._h("td",["step"]),s._h("td",["计数器步长"]),s._h("td",["number"]),s._h("td",["—"]),s._h("td",["1"])]),s._h("tr",[s._h("td",["size"]),s._h("td",["计数器尺寸"]),s._h("td",["string"]),s._h("td",["large, small"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["disabled"]),s._h("td",["是否禁用计数器"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])]),s._h("tr",[s._h("td",["controls"]),s._h("td",["是否使用控制按钮"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["true"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"events"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#events","aria-hidden":"true"}},["¶"])," Events"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["事件名称"]),s._h("th",["说明"]),s._h("th",["回调参数"])])]),s._h("tbody",[s._h("tr",[s._h("td",["change"]),s._h("td",["绑定值被改变时触发"]),s._h("td",["最后变更的值"])])])])}]}},function(s,t,a){s.exports=a(325)},function(s,t,a){var n,l;a(326),n=a(328);var e=a(329);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){},,function(s,t,a){"use strict";t.__esModule=!0;var n=a(2);n.
style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-row",{staticClass:"border-grid"},[s._h("el-col",{staticClass:"tac",attrs:{span:12}},[s._h("div",{staticClass:"text"},["激活即列出输入建议"]),s._h("el-autocomplete",{directives:[{name:"model",rawName:"v-model",value:s.state1,expression:"state1"}],staticClass:"inline-input",attrs:{"fetch-suggestions":s.querySearch,placeholder:"请输入内容"},domProps:{value:s.state1},on:{select:s.handleSelect,input:function(t){s.state1=t}}})]),s._h("el-col",{staticClass:"tac",attrs:{span:12}},[s._h("div",{staticClass:"text"},["输入后匹配输入建议"]),s._h("el-autocomplete",{directives:[{name:"model",rawName:"v-model",value:s.state2,expression:"state2"}],staticClass:"inline-input",attrs:{"fetch-suggestions":s.querySearch,placeholder:"请输入内容","trigger-on-focus":!1},domProps:{value:s.state2},on:{select:s.handleSelect,input:function(t){s.state2=t}}})])])]),s._h("p",["autocomplete 是一个可带输入建议的输入框组件，",s._h("code",["fetch-suggestions"])," 是一个返回输入建议的方法属性，如 querySearch(queryString, cb)，在该方法中你可以在你的输入建议数据准备好时通过 cb(data) 返回到 autocomplete 组件中。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-row"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"border-grid"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"12"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"tac"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"text"']),">"]),"激活即列出输入建议",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-autocomplete"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"inline-input"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"state1"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":fetch-suggestions"]),"=",s._h("span",{staticClass:"hljs-string"},['"querySearch"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"请输入内容"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["@select"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleSelect"']),"\n    >"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-autocomplete"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"12"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"tac"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"text"']),">"]),"输入后匹配输入建议",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-autocomplete"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"
},['"上海市普陀区同普路1435号"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"十二泷町"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"上海市北翟路1444弄81号B幢-107"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"星移浓缩咖啡"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"上海市嘉定区新郁路817号"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"阿姨奶茶/豪大大"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"嘉定区曹安路1611号"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"新麦甜四季甜品炸鸡"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"嘉定区曹安公路2383弄55号"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"Monica摩托主题咖啡店"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"嘉定区江桥镇曹安公路2409号1F，2383弄62号1F"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"浮生若茶（凌空soho店）"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"上海长宁区金钟路968号9号楼地下一层"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"NONO JUICE  鲜榨果汁"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"上海市长宁区天山西路119号"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"CoCo都可(北新泾店）"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"上海市长宁区仙霞西路"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"快乐柠檬（神州智慧店）"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"上海市长宁区天山西路567号1层R117号店铺"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"Merci Paul cafe"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"上海市普陀区光复西路丹巴路28弄6号楼819"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"猫山王（西郊百联店）"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"上海市长宁区仙霞西路88号第一层G05-F01-1-306"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"枪会山"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"上海市普陀区棕榈路"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"纵食"']),", ",s._h("span",{staticClass:"hljs-string"},['"address"']),": ",s._h("span",{staticClass:"hljs-string"},['"元丰天山花园(东门) 双流路267号"'])," },\n          { ",s._h("span",{staticClass:"hljs-string"},['"value"']),": ",s._h("span",{staticClass:"hljs-string"},['"钱记"'])
attrs:{id:"input-shu-ru-kuang"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#input-shu-ru-kuang","aria-hidden":"true"}},["¶"])," Input 输入框"])},function(){var s=this;return s._h("p",["通过鼠标或键盘输入字符"])},function(){var s=this;return s._h("h3",{attrs:{id:"ji-chu-yong-fa"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#ji-chu-yong-fa","aria-hidden":"true"}},["¶"])," 基础用法"])},function(){var s=this;return s._h("h3",{attrs:{id:"jin-yong-zhuang-tai"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#jin-yong-zhuang-tai","aria-hidden":"true"}},["¶"])," 禁用状态"])},function(){var s=this;return s._h("h3",{attrs:{id:"dai-icon-de-shu-ru-kuang"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#dai-icon-de-shu-ru-kuang","aria-hidden":"true"}},["¶"])," 带 icon 的输入框"])},function(){var s=this;return s._h("p",["带有图标标记输入类型"])},function(){var s=this;return s._h("h3",{attrs:{id:"wen-ben-yu"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#wen-ben-yu","aria-hidden":"true"}},["¶"])," 文本域"])},function(){var s=this;return s._h("p",["可调整大小，用于输入多行文本信息"])},function(){var s=this;return s._h("h3",{attrs:{id:"fu-he-xing-shu-ru-kuang"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#fu-he-xing-shu-ru-kuang","aria-hidden":"true"}},["¶"])," 复合型输入框"])},function(){var s=this;return s._h("p",["可前置或后置元素，一般为标签或按钮"])},function(){var s=this;return s._h("h3",{attrs:{id:"chi-cun"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#chi-cun","aria-hidden":"true"}},["¶"])," 尺寸"])},function(){var s=this;return s._h("h3",{attrs:{id:"dai-shu-ru-jian-yi"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#dai-shu-ru-jian-yi","aria-hidden":"true"}},["¶"])," 带输入建议"])},function(){var s=this;return s._h("p",["根据输入内容提供对应的输入建议"])},function(){var s=this;return s._h("h3",{attrs:{id:"zi-ding-yi-mo-ban"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#zi-ding-yi-mo-ban","aria-hidden":"true"}},["¶"])," 自定义模板"])},function(){var s=this;return s._h("p",["可自定义输入建议的显示"])},function(){var s=this;return s._h("h3",{attrs:{id:"yuan-cheng-sou-suo"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#yuan-cheng-sou-suo","aria-hidden":"true"}},["¶"])," 远程搜索"])},function(){var s=this;return s._h("p",["从服务端搜索数据"])},function(){var s=this;return s._h("h3",{attrs:{id:"input-attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#input-attributes","aria-hidden":"true"}},["¶"])," Input Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["type"]),s._h("td",["类型"]),s._h("td",["string"]),s._h("td",["text/textarea"]),s._h("td",["text"])]),s._h("tr",[s._h("td",["value"]),s._h("td",["绑定值"]),s._h("td",["string, number"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["maxlength"]),s._h("td",["最大输入长度"]),s._h("td",["number"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["minlength"]),s._h("td",["最小输入长度"]),s._h("td",["number"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["placeholder"]),s._h("td",["输入框占位文本"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["disabled"]),s._h("td",["禁用"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])]),s._h("tr",[s._h("td",["size"]),s._h("td",["输入框尺寸，只在 ",s._h("code",['type!="textarea"'])," 时有效"]),s._h("td",["string"]),s._h("td",["large, small, mini"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["icon"]),s._h("td",["输入框尾部图标"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["rows"]),s._h("td",["输入框行数，只对 ",s._h("code",[
},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"grid-content bg-purple"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"6"']),">"]),s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"grid-content bg-purple"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"6"']),">"]),s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"grid-content bg-purple"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-row"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),s._h("span",{staticClass:"undefined"},["\n  .el-row {\n    margin-bottom: 20px;\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n  .el-col {\n    border-radius: 4px;\n  }\n  .bg-purple-dark {\n    background: #99a9bf;\n  }\n  .bg-purple {\n    background: #d3dce6;\n  }\n  .bg-purple-light {\n    background: #e5e9f2;\n  }\n  .grid-content {\n    border-radius: 4px;\n    min-height: 36px;\n  }\n  .row-bg {\n    padding: 10px 0;\n    background-color: #f9fafc;\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),"\n"])])])]),s._m(6),s._m(7),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-row :gutter="20">\n  <el-col :span="16"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="8"><div class="grid-content bg-purple"></div></el-col>\n</el-row>\n<el-row :gutter="20">\n  <el-col :span="8"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="8"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="4"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="4"><div class="grid-content bg-purple"></div></el-col>\n</el-row>\n<el-row :gutter="20">\n  <el-col :span="4"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="16"><div class="grid-content bg-purple"></div></el-col>\n  <el-col :span="4"><div class="grid-content bg-purple"></div></el-col>\n</el-row>\n\n\n',script:null,style:"\n  .el-row {\n    margin-bottom: 20px;\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n  .el-col {\n    border-radius: 4px;\n  }\n  .bg-purple-dark {\n    background: #99a9bf;\n  }\n  .bg-purple {\n    background: #d3dce6;\n  }\n  .bg-purple-light {\n    background: #e5e9f2;\n  }\n  .grid-content {\n    border-radius: 4px;\n    min-height: 36px;\n  }\n  .row-bg {\n    padding: 10px 0;\n    background-color: #f9fafc;\n  }\n"}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-row",{attrs:{gutter:20}},[s._h("el-col",{attrs:{span:16}},[s._h("div",{staticClass:"grid-content bg-purple"})]),s._h("el-col",{attrs:{span:8}},[s._h("div",{staticClass:"grid-content bg-purple"})])]),s._h("el-row",{attrs:{gutter:20}},[s._h("el-col",{attrs:{span:8}},[s._h("div",{staticClass
staticClass:"hljs-name"},["el-col"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"6"']),">"]),s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"grid-content bg-purple"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-row"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-row"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"flex"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"row-bg"'])," ",s._h("span",{staticClass:"hljs-attr"},["justify"]),"=",s._h("span",{staticClass:"hljs-string"},['"space-around"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"6"']),">"]),s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"grid-content bg-purple"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"6"']),">"]),s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"grid-content bg-purple-light"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-col"])," ",s._h("span",{staticClass:"hljs-attr"},[":span"]),"=",s._h("span",{staticClass:"hljs-string"},['"6"']),">"]),s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"grid-content bg-purple"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-col"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-row"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),s._h("span",{staticClass:"undefined"},["\n  .el-row {\n    margin-bottom: 20px;\n    &:last-child {\n      margin-bottom: 0;\n    }\n  }\n  .el-col {\n    border-radius: 4px;\n  }\n  .bg-purple-dark {\n    background: #99a9bf;\n  }\n  .bg-purple {\n    background: #d3dce6;\n  }\n  .bg-purple-light {\n    background: #e5e9f2;\n  }\n  .grid-content {\n    border-radius: 4px;\n    min-height: 36px;\n  }\n  .row-bg {\n    padding: 10px 0;\n    background-color: #f9fafc;\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),"\n"])])])]),s._m(12),s._m(13),s._m(14),s._m(15)])},staticRenderFns:[function(){var s=this;return s._h("h2",{attrs:{id:"layout-bu-ju"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#layout-bu-ju"
staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-menu"])," ",s._h("span",{staticClass:"hljs-attr"},["theme"]),"=",s._h("span",{staticClass:"hljs-string"},['"dark"'])," ",s._h("span",{staticClass:"hljs-attr"},["default-active"]),"=",s._h("span",{staticClass:"hljs-string"},['"1"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"el-menu-demo"'])," ",s._h("span",{staticClass:"hljs-attr"},["mode"]),"=",s._h("span",{staticClass:"hljs-string"},['"horizontal"'])," ",s._h("span",{staticClass:"hljs-attr"},["@select"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleSelect"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-menu-item"])," ",s._h("span",{staticClass:"hljs-attr"},["index"]),"=",s._h("span",{staticClass:"hljs-string"},['"1"']),">"]),"处理中心",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-menu-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-submenu"])," ",s._h("span",{staticClass:"hljs-attr"},["index"]),"=",s._h("span",{staticClass:"hljs-string"},['"2"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"])," ",s._h("span",{staticClass:"hljs-attr"},["slot"]),"=",s._h("span",{staticClass:"hljs-string"},['"title"']),">"]),"我的工作台",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-menu-item"])," ",s._h("span",{staticClass:"hljs-attr"},["index"]),"=",s._h("span",{staticClass:"hljs-string"},['"2-1"']),">"]),"选项1",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-menu-item"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-menu-item"])," ",s._h("span",{staticClass:"hljs-attr"},["index"]),"=",s._h("span",{staticClass:"hljs-string"},['"2-2"']),">"]),"选项2",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-menu-item"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-menu-item"])," ",s._h("span",{staticClass:"hljs-attr"},["index"]),"=",s._h("span",{staticClass:"hljs-string"},['"2-3"']),">"]),"选项3",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-menu-item"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-submenu"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-menu-item"])," ",s._h("span",{staticClass:"hljs-attr"},["index"]),"=",s._h("span",{staticClass:"hljs-string"},['"3"']),">"]),"订单管理",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-menu-item"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-menu"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"line"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-menu"])," ",s._h("span",{staticClass:"hljs-attr"},["default-active"]),"=",s._h("span",{staticClass:"hljs-string"},['"1"'])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"el-menu-demo"'])," ",s._h("span",{staticClass:"hljs-attr"},["mode"]),"=",s._h("span",{staticClass:"hljs-string"},['"horizontal"'])," ",s._h("span",{staticClass:"hljs-attr"},["@select"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleSelect"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{st
var s=this;return s._h("h3",{attrs:{id:"menu-group-attribute"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#menu-group-attribute","aria-hidden":"true"}},["¶"])," Menu-Group Attribute"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["title"]),s._h("td",["分组标题"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])])])])}]}},function(s,t,a){s.exports=a(351)},function(s,t,a){var n,l;n=a(352);var e=a(353);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){"use strict";t.__esModule=!0,t.default={methods:{open:function(){var s=this;this.$alert("这是一段内容","标题名称",{confirmButtonText:"确定",callback:function(t){s.$message({type:"info",message:"action: "+t})}})},open2:function(){var s=this;this.$confirm("此操作将永久删除该文件, 是否继续?","提示",{confirmButtonText:"确定",cancelButtonText:"取消",type:"warning"}).then(function(){setTimeout(function(){s.$message({message:"删除成功!",type:"success"})},200)}).catch(function(){setTimeout(function(){s.$message({message:"已取消删除",type:"info"})},200)})},open3:function(){var s=this;this.$prompt("请输入邮箱","提示",{confirmButtonText:"确定",cancelButtonText:"取消",inputPattern:/[\w!#$%&'*+\/=?^_`{|}~-]+(?:\.[\w!#$%&'*+\/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,inputErrorMessage:"邮箱格式不正确"}).then(function(t){var a=t.value;setTimeout(function(){s.$message({type:"success",message:"你的邮箱是: "+a})},200)}).catch(function(){setTimeout(function(){s.$message({type:"info",message:"取消输入"})},200)})},open4:function(){var s=this;this.$msgbox({title:"消息",message:"这是一段内容, 这是一段内容, 这是一段内容, 这是一段内容, 这是一段内容, 这是一段内容, 这是一段内容",showCancelButton:!0,confirmButtonText:"确定",cancelButtonText:"取消"}).then(function(t){setTimeout(function(){s.$message({type:"info",message:"action: "+t})},200)})}}}},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._m(3),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-button type="text" @click="open">点击打开 Message Box</el-button>\n</template>\n\n\n',script:"\n  export default {\n    methods: {\n      open() {\n        this.$alert('这是一段内容', '标题名称', {\n          confirmButtonText: '确定',\n          callback: action => {\n            this.$message({\n              type: 'info',\n              message: `action: ${ action }`\n            });\n          }\n        });\n      }\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-button",{attrs:{type:"text"},on:{click:s.open}},["点击打开 Message Box"])]]),s._h("p",["调用",s._h("code",["$alert"]),"方法即可打开消息提示，它模拟了系统的 ",s._h("code",["alert"]),"，无法通过按下 ESC 或点击框外关闭。此例中接收了两个参数，",s._h("code",["message"]),"和",s._h("code",["title"]),"。值得一提的是，窗口被关闭后，它默认会返回一个",s._h("code",["Promise"]),"对象便于进行后续操作的处理。若不确定浏览器是否支持",s._h("code",["Promise"]),"，可自行引入第三方 polyfill 或像本例一样使用回调进行后续处理。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"text"']),"
}},["成功"]),s._h("el-button",{attrs:{plain:!0},on:{click:s.open7}},["警告"]),s._h("el-button",{attrs:{plain:!0},on:{click:s.open8}},["错误"])]]),s._h("p",["默认的 Message 是不可以被人工关闭的，如果需要可手动关闭的 Message，可以使用",s._h("code",["showClose"]),"字段。此外，和 Notification 一样，Message 拥有可控的",s._h("code",["duration"]),"，设置",s._h("code",["0"]),"为不会被自动关闭，默认为 3000 毫秒。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},[":plain"]),"=",s._h("span",{staticClass:"hljs-string"},['"true"'])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"open5"']),">"]),"消息",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},[":plain"]),"=",s._h("span",{staticClass:"hljs-string"},['"true"'])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"open6"']),">"]),"成功",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},[":plain"]),"=",s._h("span",{staticClass:"hljs-string"},['"true"'])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"open7"']),">"]),"警告",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"])," ",s._h("span",{staticClass:"hljs-attr"},[":plain"]),"=",s._h("span",{staticClass:"hljs-string"},['"true"'])," ",s._h("span",{staticClass:"hljs-attr"},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"open8"']),">"]),"错误",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    ",s._h("span",{staticClass:"hljs-attr"},["methods"]),": {\n      open5() {\n        ",s._h("span",{staticClass:"hljs-keyword"},["this"]),".$message({\n          ",s._h("span",{staticClass:"hljs-attr"},["showClose"]),": ",s._h("span",{staticClass:"hljs-literal"},["true"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["message"]),": ",s._h("span",{staticClass:"hljs-string"},["'恭喜你，这是一条成功消息'"]),"\n        });\n      },\n\n      open6() {\n        ",s._h("span",{staticClass:"hljs-keyword"},["this"]),".$message({\n          ",s._h("span",{staticClass:"hljs-attr"},["showClose"]),": ",s._h("span",{staticClass:"hljs-literal"},["true"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["message"]),": ",s._h("span",{staticClass:"hljs-string"},["'警告哦，这是一条警告消息'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["type"]),": ",s._h("span",{staticClass:"hljs-string"},["'warning'"]),"\n        });\n      },\n\n      open7() {\n        ",s._h("span",{staticClass:"hljs-keyword"},["this"]),".$message({\n          ",s._h("span",{staticClass:"hljs-attr"},["showClose"]),": ",s._h("span",{staticClass:"hljs-literal"},["true"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["message"]),": ",s
script:"\n  export default {\n    methods: {\n      handleSizeChange(val) {\n        console.log(`每页 ${val} 条`);\n      },\n      handleCurrentChange(val) {\n        this.currentPage = val;\n        console.log(`当前页: ${val}`);\n      }\n    },\n    data() {\n      return {\n        currentPage1: 5,\n        currentPage2: 5,\n        currentPage3: 5,\n        currentPage4: 4\n      };\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["显示总数"]),s._h("el-pagination",{attrs:{"current-page":s.currentPage1,"page-size":100,layout:"total, prev, pager, next",total:1e3},on:{"size-change":s.handleSizeChange,"current-change":s.handleCurrentChange}})]),s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["调整每页显示条数"]),s._h("el-pagination",{attrs:{"current-page":s.currentPage2,"page-sizes":[100,200,300,400],"page-size":100,layout:"sizes, prev, pager, next",total:1e3},on:{"size-change":s.handleSizeChange,"current-change":s.handleCurrentChange}})]),s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["直接前往"]),s._h("el-pagination",{attrs:{"current-page":s.currentPage3,"page-size":100,layout:"prev, pager, next, jumper",total:1e3},on:{"size-change":s.handleSizeChange,"current-change":s.handleCurrentChange}})]),s._h("div",{staticClass:"block"},[s._h("span",{staticClass:"demonstration"},["完整功能"]),s._h("el-pagination",{attrs:{"current-page":s.currentPage4,"page-sizes":[100,200,300,400],"page-size":100,layout:"total, sizes, prev, pager, next, jumper",total:400},on:{"size-change":s.handleSizeChange,"current-change":s.handleCurrentChange}})])]]),s._h("p",["此例是一个完整的用例，使用了",s._h("code",["size-change"]),"和",s._h("code",["current-change"]),"事件来处理页码大小和当前页变动时候触发的事件。",s._h("code",["page-sizes"]),"接受一个整型数组，数组元素为展示的选择每页显示个数的选项，",s._h("code",["[100, 200, 300, 400]"]),"表示四个选项，每页显示 100 个，200 个，300 个或者 400 个。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"block"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demonstration"']),">"]),"显示总数",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-pagination"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["@size-change"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleSizeChange"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["@current-change"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleCurrentChange"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":current-page"]),"=",s._h("span",{staticClass:"hljs-string"},['"currentPage1"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":page-size"]),"=",s._h("span",{staticClass:"hljs-string"},['"100"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["layout"]),"=",s._h("span",{staticClass:"hljs-string"},['"total, prev, pager, next"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":total"]),"=",s._h("span",{staticClass:"hljs-string"},['"1000"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-pagination"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n  ",s._h("span",{staticClass:"h
},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["visible2"]),": ",s._h("span",{staticClass:"hljs-literal"},["false"]),",\n      };\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(7),s._m(8),s._m(9),s._m(10),s._m(11),s._m(12)])},staticRenderFns:[function(){var s=this;return s._h("h2",{attrs:{id:"popover-dan-chu-kuang"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#popover-dan-chu-kuang","aria-hidden":"true"}},["¶"])," Popover 弹出框"])},function(){var s=this;return s._h("h3",{attrs:{id:"ji-chu-yong-fa"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#ji-chu-yong-fa","aria-hidden":"true"}},["¶"])," 基础用法"])},function(){var s=this;return s._h("p",["Popover 的属性与 Tooltip 很类似，它们都是基于",s._h("code",["Vue-popper"]),"开发的，因此对于重复属性，请参考 Tooltip 的文档，在此文档中不做详尽解释。"])},function(){var s=this;return s._h("h3",{attrs:{id:"qian-tao-xin-xi"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#qian-tao-xin-xi","aria-hidden":"true"}},["¶"])," 嵌套信息"])},function(){var s=this;return s._h("p",["可以在 Popover 中嵌套多种类型信息，以下为嵌套表格的例子。"])},function(){var s=this;return s._h("h3",{attrs:{id:"qian-tao-cao-zuo"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#qian-tao-cao-zuo","aria-hidden":"true"}},["¶"])," 嵌套操作"])},function(){var s=this;return s._h("p",["当然，你还可以嵌套操作，这相比 Dialog 更为轻量："])},function(){var s=this;return s._h("h3",{attrs:{id:"attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#attributes","aria-hidden":"true"}},["¶"])," Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["trigger"]),s._h("td",["触发方式"]),s._h("td",["String"]),s._h("td",["click/focus/hover/manual"]),s._h("td",["click"])]),s._h("tr",[s._h("td",["title"]),s._h("td",["标题"]),s._h("td",["String"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["content"]),s._h("td",["显示的内容，也可以通过 ",s._h("code",["slot"])," 传入 DOM"]),s._h("td",["String"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["width"]),s._h("td",["宽度"]),s._h("td",["String, Number"]),s._h("td",["—"]),s._h("td",["最小宽度 150px"])]),s._h("tr",[s._h("td",["placement"]),s._h("td",["出现位置"]),s._h("td",["String"]),s._h("td",["top/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end"]),s._h("td",["bottom"])]),s._h("tr",[s._h("td",["value(v-model)"]),s._h("td",["状态是否可见"]),s._h("td",["Boolean"]),s._h("td",["—"]),s._h("td",["false"])]),s._h("tr",[s._h("td",["offset"]),s._h("td",["出现位置的偏移量"]),s._h("td",["Number"]),s._h("td",["—"]),s._h("td",["0"])]),s._h("tr",[s._h("td",["transition"]),s._h("td",["定义渐变动画"]),s._h("td",["String"]),s._h("td",["—"]),s._h("td",["fade-in-linear"])]),s._h("tr",[s._h("td",["visible-arrow"]),s._h("td",["是否显示 Tooltip 箭头，更多参数可见",s._h("a",{attrs:{href:"https://github.com/element-component/vue-popper"}},["Vue-popper"])]),s._h("td",["Boolean"]),s._h("td",["—"]),s._h("td",["true"])]),s._h("tr",[s._h("td",["options"]),s._h("td",[s._h("a",{attrs:{href:"https://popper.js.org/documentation.html"}},["popper.js"])," 的参数"]),s._h("td",["Object"]),s._h("td",["参考 ",s._h("a",{attrs:{href:"https://popper.js.org/documentation.html"}},["popper.js"])," 文档"]),s._h("td",[s._h("code",["{ boundariesElement: 'body', gpuAcceleration: false }"])])]),s._h("tr",[s._h("td",["popper-class"]),s._h("td",["为 popper 添加类名"]),s._h("td",["String"]),s._h("td",["-"]),s._h("td",["-"])])])])},function(
staticClass:"hljs-name"},["el-radio"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"radio"'])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"radio"'])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"2"']),">"]),"备选项",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-radio"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data () {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["radio"]),": ",s._h("span",{staticClass:"hljs-string"},["'1'"]),"\n      };\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(4),s._m(5),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-radio disabled v-model="radio1" label="禁用">备选项</el-radio>\n  <el-radio disabled v-model="radio1" label="选中且禁用">备选项</el-radio>\n</template>\n\n\n',script:"\n  export default {\n    data () {\n      return {\n        radio1: '选中且禁用'\n      };\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-radio",{directives:[{name:"model",rawName:"v-model",value:s.radio1,expression:"radio1"}],attrs:{disabled:"",label:"禁用"},domProps:{value:s.radio1},on:{input:function(t){s.radio1=t}}},["备选项"]),s._h("el-radio",{directives:[{name:"model",rawName:"v-model",value:s.radio1,expression:"radio1"}],attrs:{disabled:"",label:"选中且禁用"},domProps:{value:s.radio1},on:{input:function(t){s.radio1=t}}},["备选项"])]]),s._h("p",["注意：请牢记，选中的条件是绑定的变量值等于",s._h("code",["label"]),"中的值。只要在",s._h("code",["el-radio"]),"元素中设置",s._h("code",["disabled"]),"属性即可，它接受一个",s._h("code",["Boolean"]),"，",s._h("code",["true"]),"为禁用。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio"])," ",s._h("span",{staticClass:"hljs-attr"},["disabled"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"radio1"'])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"禁用"']),">"]),"备选项",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-radio"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-radio"])," ",s._h("span",{staticClass:"hljs-attr"},["disabled"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"radio1"'])," ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"选中且禁用"']),">"]),"备选项",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-radio"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data ()
label:"广州"}],value:"",value2:"",value3:"",value4:"",value5:[],value6:"",value7:"",value8:"",value9:"",value10:[],loading:!1,states:["Alabama","Alaska","Arizona","Arkansas","California","Colorado","Connecticut","Delaware","Florida","Georgia","Hawaii","Idaho","Illinois","Indiana","Iowa","Kansas","Kentucky","Louisiana","Maine","Maryland","Massachusetts","Michigan","Minnesota","Mississippi","Missouri","Montana","Nebraska","Nevada","New Hampshire","New Jersey","New Mexico","New York","North Carolina","North Dakota","Ohio","Oklahoma","Oregon","Pennsylvania","Rhode Island","South Carolina","South Dakota","Tennessee","Texas","Utah","Vermont","Virginia","Washington","West Virginia","Wisconsin","Wyoming"]}},mounted:function(){this.list=this.states.map(function(s){return{value:s,label:s}})},methods:{remoteMethod:function(s){var t=this;""!==s?(this.loading=!0,setTimeout(function(){t.loading=!1,t.options4=t.list.filter(function(t){return t.label.toLowerCase().indexOf(s.toLowerCase())>-1})},200)):this.options4=[]}}}},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._m(3),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<template>\n  <el-select v-model="value" placeholder="请选择">\n    <el-option v-for="item in options" :label="item.label" :value="item.value">\n    </el-option>\n  </el-select>\n</template>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        options: [{\n          value: '选项1',\n          label: '黄金糕'\n        }, {\n          value: '选项2',\n          label: '双皮奶'\n        }, {\n          value: '选项3',\n          label: '蚵仔煎'\n        }, {\n          value: '选项4',\n          label: '龙须面'\n        }, {\n          value: '选项5',\n          label: '北京烤鸭'\n        }],\n        value: ''\n      }\n    }\n  }\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[[s._h("el-select",{directives:[{name:"model",rawName:"v-model",value:s.value,expression:"value"}],attrs:{placeholder:"请选择"},domProps:{value:s.value},on:{input:function(t){s.value=t}}},[s._l(s.options,function(t){return s._h("el-option",{attrs:{label:t.label},domProps:{value:t.value}})})])]]),s._h("p",[s._h("code",["v-model"]),"的值为当前被选中的",s._h("code",["el-option"]),"的 value 属性值"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-select"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value"'])," ",s._h("span",{staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"请选择"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-option"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["v-for"]),"=",s._h("span",{staticClass:"hljs-string"},['"item in options"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":label"]),"=",s._h("span",{staticClass:"hljs-string"},['"item.label"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":value"]),"=",s._h("span",{staticClass:"hljs-string"},['"item.value"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-option"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-select"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("
staticClass:"hljs-attr"},["placeholder"]),"=",s._h("span",{staticClass:"hljs-string"},['"请选择"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-option-group"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["v-for"]),"=",s._h("span",{staticClass:"hljs-string"},['"group in options3"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},[":label"]),"=",s._h("span",{staticClass:"hljs-string"},['"group.label"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-option"]),"\n        ",s._h("span",{staticClass:"hljs-attr"},["v-for"]),"=",s._h("span",{staticClass:"hljs-string"},['"item in group.options"']),"\n        ",s._h("span",{staticClass:"hljs-attr"},[":label"]),"=",s._h("span",{staticClass:"hljs-string"},['"item.label"']),"\n        ",s._h("span",{staticClass:"hljs-attr"},[":value"]),"=",s._h("span",{staticClass:"hljs-string"},['"item.value"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-option"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-option-group"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-select"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["options3"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'热门城市'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["options"]),": [{\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["'Shanghai'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海'"]),"\n          }, {\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["'Beijing'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'北京'"]),"\n          }]\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'城市名'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["options"]),": [{\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["'Chengdu'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'成都'"]),"\n          }, {\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["'Shenzhen'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'深圳'"]),"\n          }, {\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["'Guangzhou'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'广州'"]),"\n          }, {\n            ",s._h("span",{staticClass:"hljs-attr"},["value"]),": ",s._h("span",{staticClass:"hljs-string"},["'Dalian'"]),",\n            ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'大连'"]),"\n          }]\n        }],\n        ",s._h("span",{staticClass:"hljs-attr"},["value7"]),": ",s._h("span",{staticClass:"hljs-string"},["''"]),"\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["scr
value:s.value3,expression:"value3"}],attrs:{disabled:""},domProps:{value:s.value3},on:{input:function(t){s.value3=t}}})])]]),s._h("p",["通过设置绑定值自定义滑块的初始值"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"block"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demonstration"']),">"]),"默认",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-slider"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value1"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-slider"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"block"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demonstration"']),">"]),"自定义初始值",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-slider"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value2"']),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-slider"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"block"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["span"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"demonstration"']),">"]),"禁用",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["span"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-slider"])," ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value3"'])," ",s._h("span",{staticClass:"hljs-attr"},["disabled"]),">"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-slider"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["value1"]),": ",s._h("span",{staticClass:"hljs-number"},["0"]),",\n        ",s._h("span",{staticClass:"hljs-attr"},["value2"]),": ",s._h("span",{staticClass:"hljs-number"},["50"]),",\n        ",s._h("span",{staticC
}]}},function(s,t,a){s.exports=a(409)},function(s,t,a){var n,l;a(410),n=a(412);var e=a(413);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){},,function(s,t){"use strict";t.__esModule=!0,t.default={data:function(){return{value1:!0,value2:!0,value3:!0}}}},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-switch v-model="value1" on-text="" off-text>\n</el-switch>\n<el-switch v-model="value2" on-color="#13ce66" off-color="#ff4949">\n</el-switch>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        value1: true,\n        value2: true\n      }\n    }\n  };\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-switch",{directives:[{name:"model",rawName:"v-model",value:s.value1,expression:"value1"}],attrs:{"on-text":"","off-text":""},domProps:{value:s.value1},on:{input:function(t){s.value1=t}}}),s._h("el-switch",{directives:[{name:"model",rawName:"v-model",value:s.value2,expression:"value2"}],attrs:{"on-color":"#13ce66","off-color":"#ff4949"},domProps:{value:s.value2},on:{input:function(t){s.value2=t}}})]),s._h("p",["绑定",s._h("code",["v-model"]),"到一个",s._h("code",["Boolean"]),"类型的变量。可以使用",s._h("code",["on-text"]),"属性与",s._h("code",["off-text"]),"属性来设置开关的文字描述，使用",s._h("code",["on-color"]),"属性与",s._h("code",["off-color"]),"属性来设置开关的背景色。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-switch"]),"\n  ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value1"']),"\n  ",s._h("span",{staticClass:"hljs-attr"},["on-text"]),"=",s._h("span",{staticClass:"hljs-string"},['""']),"\n  ",s._h("span",{staticClass:"hljs-attr"},["off-text"]),"=",s._h("span",{staticClass:"hljs-string"},['""']),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-switch"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-switch"]),"\n  ",s._h("span",{staticClass:"hljs-attr"},["v-model"]),"=",s._h("span",{staticClass:"hljs-string"},['"value2"']),"\n  ",s._h("span",{staticClass:"hljs-attr"},["on-color"]),"=",s._h("span",{staticClass:"hljs-string"},['"#13ce66"']),"\n  ",s._h("span",{staticClass:"hljs-attr"},["off-color"]),"=",s._h("span",{staticClass:"hljs-string"},['"#ff4949"']),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-switch"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["value1"]),": ",s._h("span",{staticClass:"hljs-literal"},["true"]),",\n        ",s._h("span",{staticClass:"hljs-attr"},["value2"]),": ",s._h("span",{staticClass:"hljs-literal"},["true"]),"\n      }\n    }\n  };\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(3),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-switch v-model="value3" on-text="" off-text disabled>\n</el-switch>\n<el-switch v-model="value3" disabled>\n</el-switch>\n\n\n',script:"\n  export default {\n    data() {\n      return {\n        value3: true\n      }\n    }\n  };\n",style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-switch",{directives:[{name:"model",rawName:"v-model",value:s.value3,expression:"value3"}],attrs:{"
staticClass:"hljs-string"},['"tableRowClassName"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"date"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"日期"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"180"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"name"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"姓名"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"180"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"address"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"地址"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),s._h("span",{staticClass:"css"},["\n  ",s._h("span",{staticClass:"hljs-selector-class"},[".el-table"])," ",s._h("span",{staticClass:"hljs-selector-class"},[".info-row"])," {\n    ",s._h("span",{staticClass:"hljs-attribute"},["background"]),": ",s._h("span",{staticClass:"hljs-number"},["#c9e5f5"]),";\n  }\n\n  ",s._h("span",{staticClass:"hljs-selector-class"},[".el-table"])," ",s._h("span",{staticClass:"hljs-selector-class"},[".positive-row"])," {\n    ",s._h("span",{staticClass:"hljs-attribute"},["background"]),": ",s._h("span",{staticClass:"hljs-number"},["#e2f0e4"]),";\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["style"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    ",s._h("span",{staticClass:"hljs-attr"},["methods"]),": {\n      tableRowClassName(row, index) {\n        ",s._h("span",{staticClass:"hljs-keyword"},["if"])," (index === ",s._h("span",{staticClass:"hljs-number"},["1"]),") {\n          ",s._h("span",{staticClass:"hljs-keyword"},["return"])," ",s._h("span",{staticClass:"hljs-string"},["'info-row'"]),";\n        } ",s._h("span",{staticClass:"hljs-keyword"},["else"])," ",s._h("span",{staticClass:"hljs-keyword"},["if"])," (index === ",s._h("span",{staticClass:"hljs-number"},["3"]),") {\n          ",s._h("span",{staticClass:"hljs-keyword"},["return"])," ",s._h("span",{staticClass:"hljs-string"},["'positive-row'"]),";\n        }\n        ",s._h("span",{staticClass:"hljs-keyword"},["return"])," ",s._h("span",{staticClass:"hljs-string"},["''"]),";\n      }\n    },\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["tableData2"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-02'"]),",\n          ",s._h("span",{staticCla
},['"市区"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"120"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"address"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"地址"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"300"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"zip"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"邮编"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"120"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["tableData3"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-03'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'王小虎'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["province"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["city"]),": ",s._h("span",{staticClass:"hljs-string"},["'普陀区'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海市普陀区金沙江路 1518 弄'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["zip"]),": ",s._h("span",{staticClass:"hljs-number"},["200333"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-02'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'王小虎'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["province"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["city"]),": ",s._h("span",{staticClass:"hljs-string"},["'普陀区'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海市普陀区金沙江路 1518 弄'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["zip"]),": ",s._h("span",{staticClass:"hljs-number"},["200333"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-04'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'王小虎'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["province"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["city"]),": ",s._
},["el-table"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},[":data"]),"=",s._h("span",{staticClass:"hljs-string"},['"tableData3"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["border"]),"\n    ",s._h("span",{staticClass:"hljs-attr"},["style"]),"=",s._h("span",{staticClass:"hljs-string"},['"width: 100%"']),"\n    ",s._h("span",{staticClass:"hljs-attr"},["@selection-change"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleSelectionChange"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["type"]),"=",s._h("span",{staticClass:"hljs-string"},['"selection"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"50"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["inline-template"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"日期"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"120"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),s._h("span",["{{"])," row.date ",s._h("span",["}}"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"name"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"姓名"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["width"]),"=",s._h("span",{staticClass:"hljs-string"},['"120"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),"\n      ",s._h("span",{staticClass:"hljs-attr"},["prop"]),"=",s._h("span",{staticClass:"hljs-string"},['"address"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["label"]),"=",s._h("span",{staticClass:"hljs-string"},['"地址"']),"\n      ",s._h("span",{staticClass:"hljs-attr"},["show-overflow-tooltip"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["tableData3"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-03'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'王小虎'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海市普陀区金沙江路 1518 弄'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-02'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),"
},["@click"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleDelete($index, row)"']),">"]),"\n          删除\n        ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["div"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table-column"]),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-table"]),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["template"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["tableData"]),": [{\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-02'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'王小虎'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海市普陀区金沙江路 1518 弄'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-04'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'王小虎'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海市普陀区金沙江路 1517 弄'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-01'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'王小虎'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海市普陀区金沙江路 1519 弄'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-attr"},["date"]),": ",s._h("span",{staticClass:"hljs-string"},["'2016-05-03'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'王小虎'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["address"]),": ",s._h("span",{staticClass:"hljs-string"},["'上海市普陀区金沙江路 1516 弄'"]),"\n        }]\n      }\n    },\n    ",s._h("span",{staticClass:"hljs-attr"},["methods"]),": {\n      handleEdit(index, row) {\n        ",s._h("span",{staticClass:"hljs-built_in"},["console"]),".log(index, row);\n      },\n      handleDelete(index, row) {\n        ",s._h("span",{staticClass:"hljs-built_in"},["console"]),".log(index, row);\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(27),s._m(28),s._m(29),s._m(30),s._m(31),s._m(32),s._m(33),s._m(34)])},staticRenderFns:[function(){var s=this;return s._h("h2",{attrs:{id:"table-biao-ge"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#table-biao-ge","aria-hidden":"true"}},["¶"])," Table 表格"])},function(){var s=this;return s._h("p",["用于展示多条结构类似的数据，可对数据进行排序、筛选、对比或其他自定义操作。"])},function(){var s=this;return s._h("h3",{attrs:{id:"ji-chu-biao-ge"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#ji-chu-biao-ge","aria-hidden":"true"}},["¶"])," 基础表格"])},function(){var s=this;return s._h("p",["基础的表格展示用法。"])},function(){var s=this;return s._h("h3",{attrs:{id:"dai-ban-ma-wen-biao-ge"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#dai-ban-ma-wen-biao-g
staticClass:"header-anchor",attrs:{href:"#qia-pian-hua","aria-hidden":"true"}},["¶"])," 卡片化"])},function(){var s=this;return s._h("p",["卡片化的标签页。"])},function(){var s=this;return s._h("h3",{attrs:{id:"tabs-attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#tabs-attributes","aria-hidden":"true"}},["¶"])," Tabs Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["type"]),s._h("td",["风格类型"]),s._h("td",["string"]),s._h("td",["card/border-card"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["closable"]),s._h("td",["标签是否可关闭"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])]),s._h("tr",[s._h("td",["active-name"]),s._h("td",["选中选项卡的 name"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["第一个选项卡的 name"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"tabs-events"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#tabs-events","aria-hidden":"true"}},["¶"])," Tabs Events"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["事件名称"]),s._h("th",["说明"]),s._h("th",["回调参数"])])]),s._h("tbody",[s._h("tr",[s._h("td",["tab-click"]),s._h("td",["tab 被选中的钩子"]),s._h("td",["被选中的标签 tab 实例"])]),s._h("tr",[s._h("td",["tab-remove"]),s._h("td",["tab 被删除的钩子"]),s._h("td",["被删除的标签 tab 实例"])])])])},function(){var s=this;return s._h("h3",{attrs:{id:"tab-pane-attributes"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#tab-pane-attributes","aria-hidden":"true"}},["¶"])," Tab-pane Attributes"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["label"]),s._h("td",["选项卡标题"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["label-content"]),s._h("td",["选项卡的标题的渲染 Function"]),s._h("td",["Function(h)"]),s._h("td",["-"]),s._h("td",["-"])]),s._h("tr",[s._h("td",["name"]),s._h("td",["与选项卡 activeName 对应的标识符，表示选项卡别名"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["该选项卡在选项卡列表中的顺序值，如第一个选项卡则为'1'"])])])])}]}},function(s,t,a){s.exports=a(425)},function(s,t,a){var n,l;a(426),n=a(428);var e=a(429);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){},,function(s,t){"use strict";t.__esModule=!0,t.default={data:function(){return{tags:[{key:1,name:"标签一",type:""},{key:2,name:"标签二",type:"gray"},{key:5,name:"标签三",type:"primary"},{key:3,name:"标签四",type:"success"},{key:4,name:"标签五",type:"warning"},{key:6,name:"标签六",type:"danger"}]}},methods:{handleClose:function(s){this.tags.splice(this.tags.indexOf(s),1)}}}},function(s,t){s.exports={render:function(){var s=this;return s._h("section",[s._m(0),s._m(1),s._m(2),s._h("demo-block",{staticClass:"demo-box",attrs:{jsfiddle:{html:'<el-tag>标签一</el-tag>\n<el-tag type="gray">标签二</el-tag>\n<el-tag type="primary">标签三</el-tag>\n<el-tag type="success">标签四</el-tag>\n<el-tag type="warning">标签五</el-tag>\n<el-tag type="danger">标签六</el-tag>\n',script:null,style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-tag",["标签一"]),s._h("el-tag",{attrs:{type:"gray"}},["标签二"]),s._h("el-tag",{attrs:{type:"primary"}},["标签三"]),s._h("el-tag",{attrs:{type:"success"}},["标签四"]),s._h("el-tag",{attrs:{type:"warning"}},["标签五"]),s._h("el-tag",{attrs:{type:"danger"}},["标签六"])]),s._h("p",["由",s._h("
}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("div",{staticClass:"box"},[s._h("div",{staticClass:"top"},[s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Top Left 提示文字",placement:"top-start"}},[s._h("el-button",["上左"])]),s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Top Center 提示文字",placement:"top"}},[s._h("el-button",["上边"])]),s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Top Right 提示文字",placement:"top-end"}},[s._h("el-button",["上右"])])]),s._h("div",{staticClass:"left"},[s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Left Top 提示文字",placement:"left-start"}},[s._h("el-button",["左上"])]),s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Left Center 提示文字",placement:"left"}},[s._h("el-button",["左边"])]),s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Left Bottom 提示文字",placement:"left-end"}},[s._h("el-button",["左下"])])]),s._h("div",{staticClass:"right"},[s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Right Top 提示文字",placement:"right-start"}},[s._h("el-button",["右上"])]),s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Right Center 提示文字",placement:"right"}},[s._h("el-button",["右边"])]),s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Right Bottom 提示文字",placement:"right-end"}},[s._h("el-button",["右下"])])]),s._h("div",{staticClass:"bottom"},[s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Bottom Left 提示文字",placement:"bottom-start"}},[s._h("el-button",["下左"])]),s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Bottom Center 提示文字",placement:"bottom"}},[s._h("el-button",["下边"])]),s._h("el-tooltip",{staticClass:"item",attrs:{effect:"dark",content:"Bottom Right 提示文字",placement:"bottom-end"}},[s._h("el-button",["下右"])])])])]),s._h("p",["使用",s._h("code",["content"]),"属性来决定",s._h("code",["hover"]),"时的提示信息。由",s._h("code",["placement"]),"属性决定展示效果：",s._h("code",["placement"]),"属性值为：",s._h("code",["方向-对齐位置"]),"；四个方向：",s._h("code",["top"]),"、",s._h("code",["left"]),"、",s._h("code",["right"]),"、",s._h("code",["bottom"]),"；三种对齐位置：",s._h("code",["start"]),", ",s._h("code",["end"]),"，默认为空。如",s._h("code",['placement="left-end"']),"，则提示信息出现在目标元素的左侧，且提示信息的底部与目标元素的底部对齐。"]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"box"']),">"]),"\n  ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["div"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"top"']),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tooltip"])," ",s._h("span",{staticClass:"hljs-attr"},["class"]),"=",s._h("span",{staticClass:"hljs-string"},['"item"'])," ",s._h("span",{staticClass:"hljs-attr"},["effect"]),"=",s._h("span",{staticClass:"hljs-string"},['"dark"'])," ",s._h("span",{staticClass:"hljs-attr"},["content"]),"=",s._h("span",{staticClass:"hljs-string"},['"Top Left 提示文字"'])," ",s._h("span",{staticClass:"hljs-attr"},["placement"]),"=",s._h("span",{staticClass:"hljs-string"},['"top-start"']),">"]),"\n      ",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"上左",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-button"]),">"]),"\n    ",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tooltip"]),">"]),"\n    ",s._h
style:null}}},[s._h("div",{slot:"source",staticClass:"source"},[s._h("el-tree",{attrs:{data:s.regions,props:s.props,load:s.loadNode,lazy:"","show-checkbox":""},on:{"check-change":s.handleCheckChange}})]),s._h("div",{slot:"highlight",staticClass:"highlight"},[s._h("pre",[s._h("code",{staticClass:"hljs language-html"},[s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["el-tree"]),"\n  ",s._h("span",{staticClass:"hljs-attr"},[":data"]),"=",s._h("span",{staticClass:"hljs-string"},['"regions"']),"\n  ",s._h("span",{staticClass:"hljs-attr"},[":props"]),"=",s._h("span",{staticClass:"hljs-string"},['"props"']),"\n  ",s._h("span",{staticClass:"hljs-attr"},[":load"]),"=",s._h("span",{staticClass:"hljs-string"},['"loadNode"']),"\n  ",s._h("span",{staticClass:"hljs-attr"},["lazy"]),"\n  ",s._h("span",{staticClass:"hljs-attr"},["show-checkbox"]),"\n  ",s._h("span",{staticClass:"hljs-attr"},["@check-change"]),"=",s._h("span",{staticClass:"hljs-string"},['"handleCheckChange"']),">"]),"\n",s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["el-tree"]),">"]),"\n\n",s._h("span",{staticClass:"hljs-tag"},["<",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),s._h("span",{staticClass:"javascript"},["\n  ",s._h("span",{staticClass:"hljs-keyword"},["export"])," ",s._h("span",{staticClass:"hljs-keyword"},["default"])," {\n    data() {\n      ",s._h("span",{staticClass:"hljs-keyword"},["return"])," {\n        ",s._h("span",{staticClass:"hljs-attr"},["regions"]),": [{\n          ",s._h("span",{staticClass:"hljs-string"},["'name'"]),": ",s._h("span",{staticClass:"hljs-string"},["'region1'"]),"\n        }, {\n          ",s._h("span",{staticClass:"hljs-string"},["'name'"]),": ",s._h("span",{staticClass:"hljs-string"},["'region2'"]),"\n        }],\n        ",s._h("span",{staticClass:"hljs-attr"},["props"]),": {\n          ",s._h("span",{staticClass:"hljs-attr"},["label"]),": ",s._h("span",{staticClass:"hljs-string"},["'name'"]),",\n          ",s._h("span",{staticClass:"hljs-attr"},["children"]),": ",s._h("span",{staticClass:"hljs-string"},["'zones'"]),"\n        },\n        ",s._h("span",{staticClass:"hljs-attr"},["count"]),": ",s._h("span",{staticClass:"hljs-number"},["1"]),"\n      };\n    },\n    ",s._h("span",{staticClass:"hljs-attr"},["methods"]),": {\n      handleCheckChange(data, checked, indeterminate) {\n        ",s._h("span",{staticClass:"hljs-built_in"},["console"]),".log(data, checked, indeterminate);\n      },\n      handleNodeClick(data) {\n        ",s._h("span",{staticClass:"hljs-built_in"},["console"]),".log(data);\n      },\n      loadNode(node, resolve) {\n        ",s._h("span",{staticClass:"hljs-keyword"},["if"])," (node.level === ",s._h("span",{staticClass:"hljs-number"},["0"]),") {\n          ",s._h("span",{staticClass:"hljs-keyword"},["return"])," resolve([{ ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'region1'"])," }, { ",s._h("span",{staticClass:"hljs-attr"},["name"]),": ",s._h("span",{staticClass:"hljs-string"},["'region2'"])," }]);\n        }\n        ",s._h("span",{staticClass:"hljs-keyword"},["if"])," (node.level > ",s._h("span",{staticClass:"hljs-number"},["3"]),") ",s._h("span",{staticClass:"hljs-keyword"},["return"])," resolve([]);\n\n        ",s._h("span",{staticClass:"hljs-keyword"},["var"])," hasChild;\n        ",s._h("span",{staticClass:"hljs-keyword"},["if"])," (node.data.name === ",s._h("span",{staticClass:"hljs-string"},["'region1'"]),") {\n          hasChild = ",s._h("span",{staticClass:"hljs-literal"},["true"]),";\n        } ",s._h("span",{staticClass:"hljs-keyword"},["else"])," ",s._h("span",{staticClass:"hljs-keyword"},["if"])," (node.data.name === ",s._h("span",{staticClass:"hljs-string"},["'region2'"]),") {\n          hasChild = ",s._h("span",{staticClass:"hljs-literal"},["false"]),";\n        } ",s._h("span",{staticClass:"hljs-keyword"},["else"])," {\n          hasChild = ",s._h("span",{staticClass:"hljs-built_in"},["Math"]),".random() > ",s._h("span",{staticClass:"hljs-number"},["0.5"]
},["'food2.jpeg'"]),", ",s._h("span",{staticClass:"hljs-attr"},["url"]),": ",s._h("span",{staticClass:"hljs-string"},["'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'"]),"}]\n      };\n    },\n    ",s._h("span",{staticClass:"hljs-attr"},["methods"]),": {\n      handleRemove(file, fileList) {\n        ",s._h("span",{staticClass:"hljs-built_in"},["console"]),".log(file, fileList);\n      },\n      handlePreview(file) {\n        ",s._h("span",{staticClass:"hljs-built_in"},["console"]),".log(file);\n      }\n    }\n  }\n"]),s._h("span",{staticClass:"hljs-tag"},["</",s._h("span",{staticClass:"hljs-name"},["script"]),">"]),"\n"])])])]),s._m(7),s._m(8),s._m(9),s._m(10)])},staticRenderFns:[function(){var s=this;return s._h("h2",{attrs:{id:"upload-shang-chuan"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#upload-shang-chuan","aria-hidden":"true"}},["¶"])," Upload 上传"])},function(){var s=this;return s._h("p",["通过点击或者拖拽上传文件"])},function(){var s=this;return s._h("h3",{attrs:{id:"dian-ji-shang-chuan-duo-ge-wen-jian"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#dian-ji-shang-chuan-duo-ge-wen-jian","aria-hidden":"true"}},["¶"])," 点击上传多个文件"])},function(){var s=this;return s._h("h3",{attrs:{id:"tuo-zhuai-shang-chuan"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#tuo-zhuai-shang-chuan","aria-hidden":"true"}},["¶"])," 拖拽上传"])},function(){var s=this;return s._h("p",["可将文件拖入指定区域进行上传。"])},function(){var s=this;return s._h("h3",{attrs:{id:"shang-chuan-dan-ge-tu-pian"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#shang-chuan-dan-ge-tu-pian","aria-hidden":"true"}},["¶"])," 上传单个图片"])},function(){var s=this;return s._h("p",["专门针对图片类型文件的上传，上传后在原位置显示缩略图。"])},function(){var s=this;return s._h("h3",{attrs:{id:"upload-attribute"}},[s._h("a",{staticClass:"header-anchor",attrs:{href:"#upload-attribute","aria-hidden":"true"}},["¶"])," Upload Attribute"])},function(){var s=this;return s._h("table",{staticClass:"table"},[s._h("thead",[s._h("tr",[s._h("th",["参数"]),s._h("th",["说明"]),s._h("th",["类型"]),s._h("th",["可选值"]),s._h("th",["默认值"])])]),s._h("tbody",[s._h("tr",[s._h("td",["action"]),s._h("td",["必选参数, 上传的地址"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["headers"]),s._h("td",["可选参数, 设置上传的请求头部"]),s._h("td",["object"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["multiple"]),s._h("td",["可选参数, 是否支持多选文件"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["data"]),s._h("td",["可选参数, 上传时附带的额外参数"]),s._h("td",["object"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["name"]),s._h("td",["可选参数, 上传的文件字段名"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["file"])]),s._h("tr",[s._h("td",["with-credentials"]),s._h("td",["支持发送 cookie 凭证信息"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["false"])]),s._h("tr",[s._h("td",["show-upload-list"]),s._h("td",["是否显示已上传文件列表"]),s._h("td",["boolean"]),s._h("td",["—"]),s._h("td",["true"])]),s._h("tr",[s._h("td",["type"]),s._h("td",["上传控件类型"]),s._h("td",["string"]),s._h("td",["select,drag"]),s._h("td",["select"])]),s._h("tr",[s._h("td",["accept"]),s._h("td",["可选参数, 接受上传的",s._h("a",{attrs:{href:"https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#attr-accept"}},["文件类型"]),"（thumbnail-mode 模式下此参数无效）"]),s._h("td",["string"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",[s._h("td",["on-preview"]),s._h("td",["可选参数, 点击已上传的文件链接时的钩子, 可以通过 file.response 拿到服务端返回数据"]),s._h("td",["function(file)"]),s._h("td",["—"]),s._h("td",["—"])]),s._h("tr",
},function(s,t){s.exports="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKAAAACgCAYAAACLz2ctAAAAAXNSR0IArs4c6QAAF4VJREFUeAHtXXuMJMV9/lXP7s7O3mPvbg/IHSA46/BCsCwbyealOKfDJH4cWIkQKA4gWRArkSIskYAxsWNZtokDDlL4J0qCZQkjLBBShH0ODjanCxGYyx/4BcSrO+4hjjv29vZ25+52Zmdnpivf17MzOzM7j+6Zrp6e2Spp1N3VVV/96qtv6tXV1Uqsq2HgrNZbJSuTRSWTSruTouUCUWoDjhu0Eu+olo/CI52Wczg/p5ePavkoWtN/RitnKqFlSlIytVGp0zUJrvELtVbzr7Vel87JjRDPNcp1J7VSFNukFr3FJCdK1BmIckppPaUdZwrnb4wn5VWl1ILJdOOKvWYECMElzy/KdQXX3Y0abTcyfi38huNQMBBfXoscQI25b8hx9q0fldfhl4uDbaZtGGgBphf1FWgWb0PB3oQCvgHHlGlCQ8FXKouCeQ1/lJfR3D8/PqoOhoIbQ5CBE2Ba6y06I3eI0nehhrs+hpwHNgm14S9Eqx+oMXl2XKEJHyA3EAJkUzqfkc8qiA5lswfXIwNURpWsQIhLuNirIcZNY/ITNt2Vm3160tcCPK/1RYWsez9qh3sweJjo0zLoyGwMZmZRy39vKOU8vl6p6Y5AYhCpLwWYyehLc+I+iEK4F7XdaAx47JkJqAUX8ed7MinOo2Nj6t2eGdJhwn0lQAwqduqi+xA653ez2e0wzwMZzWuOtX5KJZzvYNByqF8y2RcC9EazrvsNEXU7hJfoF3J7YSeEWMTM+HPKcb7eD6PnWAsQYkvNZ9yHQeoDOE/2okD7NU1wlgNnj20acx7BeTau+YitAM8u6j2uq58AiTviSl4/2AXxHXEcdd/GUbU3jvbGToDZrL5sUet/xqTx5+JIWN/apNQLo0p9KZVSx+KUBycuxqCmS8xn9UMQ39tWfAZKBX9ockuOybWBFDqCjEUNuKD1tnxWPwNidnWUCxspEANolvcPp9Tn1yl1MlBEA4F7LsD5RX2zFPXTmMu60ED+LGQTBjCHekoS6s5No+pnTYJE4t2zJthrcheK3xJX/9SKL5KyrknE4xzcz6MMetkk96QGXFjQ25eU/iH6ep+oYcVe9IYBpV4Z0erP1q1TJ6I2IHIBpjOa6/B+jH/gBVFn1qbXnAE0yTPoG94yPqYONA8V/p1Im2A80fi0K3qfFV/4BdktIsuEZcMy6hYrSPzIBJjO6ju1q3+EZncsiIE2bIQMoGxYRiyrqFKNRIBzGX0/mt2n8BuKKmM2nc4YYBmxrFhmnSEEi2W0D4iMqHTW/Ucsi38gmFk2dBwYwOsAj42nnC+jb4g3Gsw4YwL0xJdx/x2W32PGdIsaBQMQyJPjY84XTYnQWBPs1XxWfFFoxGgaqEDuZVmaSsRIDej1H7T7T6aMtrg9YEA5f7N5TD0edsqhC9Ab7ZYGHKFjh515i+efATbB+N09nlJP+4/VPmSoIuEcEofxHEm1T9qG6DcGIMCCctStWGn9Yli2hyZAPuHgRKad5wuraGKKo1TGEbU7rCcmoQiQz3bzon9ln3DEVDQhm8XHdsOiPhLGs+OuR8FobhNcWGDFF3IpxxiOZe2VeQgLW7sWYDqDt9XsqpYYy8WQaShzr+y7hO+qCfYWk3I9n9ZdC7nLfNjoPWAAgxJXHPWpbha1dixAbxl9xuv32ZXMPSj8uCTJldXDY+gPdri8vyMBst+H+b6f47grKiLOnCvI1InSlnmT25OyZUNvZ3riZk9U5dAoHdSE+zE/+Ekc8VJ8MNdR05leFL4ovitYUt2FpvhyBe39ykLsDrG72HGzp7vcdBebWqAmOkEJXI0sv7f7tU4S6yYOxVd21edlv6iP1TZUn0dpBwpeiu6SuMWCaBeVj3ZLySvM1DkJcRJDknBGsJVORw1doKzAlq9BGz8M+t5x4BoQ75Y+YSebA5VN6IExDSL5fFZyi2kpLGUhQMzCQnz8i3o/nNOP9xiGYRnHqMNiVk8bARMJJEBul4Gc3howDRs8RAaKbl6WsmkpFvxvIc2wXhzENeqgDU8jARLxLUBUsSnu1RIA2wYNmYEChJTPLXRUl7H+Y1ximHTL+/mk/KbhW4DcpQoi3OEX2IYLlwHWfAU0pd06YhDLlKNGqBW/+L4EyP350JF90C+oDRcuA+y/FVB7heWIZbJPCK08QM34sdeXADU2h4SyB3Ljbz8k9TpMIb/YUbPbzG42x8Q05aCVJDXjB7+tAKHkndyZ1A+YDRM+AyjMQAMOvxZwYEJsc07dXtJO6xTaCpB7MsPQ2Gzn1To7g3eX83ymnElsasbbz7uN8S0FyN3ouSF4Gwx72yADnGQ25UxiezZDO56GWmSgpQD5KQQo2e5G34JA07e8JxyGEjGJTZOpHWqolflNBciPwGClw72tItt75hngEw5TziR22WZqiFoqX9cfmwqQXyCCgtf0R2DqyerFNcrAWLImsctGU0Pe16zKHnXHhgJEpGF+/qourL3sAQP5vLk+oEnsGqr4KbUmXbmGAuSH/zBRuaa+vVZDWIwuFnPmRsEmsasppJaoqWq/8nlDAS5/dbIcxh57yMDc/Lyx1E1i1xvdTFOrBMjv7SLynnoAe90bBubnzhpL2CR2A6P3LGur5tYqAfJjz2iv7WO3Gpp6eIHFpKdmZkM3wMOMYKFq2XBqyvuQeNlj+bhKgPgGrZ14riOpl5epVEqOv3dCisXAr1s0NZtYxCR2pK70QfGaJGsEyBUMUOp1NSHsRU8ZmJiYkKWlvBw6fDQ0O4hFTGJH6aCt6+tXydQIEFNOt0VpkE2rPQNbJ0ofE5ibS8vRY8fbR2gTghjEoitjt4kS6u16jdUIEM9Obgo1NQvWNQPJZFK2bdvu4bw/fUqmDr7TUXPMZpdxiUFHTGJH7uo0VhEgqsck5txviNwgm2BbBi6//AMylCgtSGLt9evfvh1oYMIBB+OUaz5iEbMXjhqj1sppV17LPL8o16EGjLhXWjbDHlsxkBwZkSuvulrefPM3XjD23w4fOYaBxEnZvHlcNm8al9HkiIwMl9aNLOXzwknmufm0J7qlpdrJbGIRsycOGju/qDjO+G+mXxFgwXV398Qgm6gvBrZObJWdO6+QQ4cOVsJTWNPTM96v4tnmhBjE6qVb1ponwEoTjHV/VoC9LBUfaV9y8aXyoQ99uNIc+4hSCcJml3GJ0XNXpTVPgGiT1ymRa3tumDWgLQOsvT728esrA5O2ERCAAw7G6XXNV7aVWqPmeO01wemc3AgPu/C0zFDMj+y/TX7wSrn8sh1yenZGZmdn5Uwab82VX7d0hmXL+Dpvno9TLT0Z7bbgkFpL59SNCPJSqQ+o5ZoW4e2tmDJAYV28/RLvt/+t8zVWfvjq9TXXsbsoae4lrwlWrjsZOwOtQQPNQFlzXg2ID0BMYgpmoDMcRuamsTHBfnzS+X9OKjl0Zr3M59Gbgds0rOX5OSV/sE3LLswZX2Qns9rS7WkOocpNsK0BW1A2g3e4/+UtJS8cQTdLl0SHd6UrMaZzSqZPirwKYT76Sy2f2yHyV1drucC+0FDhaNWJFk9zzlmtt2LFKtcAWteAAdZ4f/Kikv84rKrE1yDgshcFyrCMw7jWNWaAmqP2HMmWlNg42Nr2feaQyP2vKlkorNR2fhlhHMYlhnVNGID2nKKyAmxED2uv7/5SYU+W4OIr4zEuMWxNWGak9kjtOUrbEXAtLSLs8331QHfiK2NShMQipnW1DFB7EKDYzyzU8uINODppdutgKpfE4iDGuloGqD0Hw+ENtd5r+4pTLRzthu2ISWzrVhig9hx0cqwAVzjx+msrUy1VN7o8JabtC9aRCO1hP38rwGpaOMlsypnENmWzUVxoz8EDkJg/NDRKwSrw47WPVFfd78bDJHY3dvUqLrXn4NVQ2wRXlcB0puoi5FOT2CGbGgkctWf7gHVUFw0+EzeJXZeN/ri0fcDV5aRcc7tRmcRenZM+8PFqwD6wM0oT80vmPuRiEjtKjsJMi0
},function(s,t){s.exports="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+Cjxzdmcgd2lkdGg9IjgxcHgiIGhlaWdodD0iNzdweCIgdmlld0JveD0iMCAwIDgxIDc3IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPgogICAgPCEtLSBHZW5lcmF0b3I6IFNrZXRjaCAzOS4xICgzMTcyMCkgLSBodHRwOi8vd3d3LmJvaGVtaWFuY29kaW5nLmNvbS9za2V0Y2ggLS0+CiAgICA8dGl0bGU+TW9kdWxlX2ljb248L3RpdGxlPgogICAgPGRlc2M+Q3JlYXRlZCB3aXRoIFNrZXRjaC48L2Rlc2M+CiAgICA8ZGVmcz4KICAgICAgICA8cmVjdCBpZD0icGF0aC0xIiB4PSI2IiB5PSI1NyIgd2lkdGg9IjExIiBoZWlnaHQ9IjExIiByeD0iNS41Ij48L3JlY3Q+CiAgICAgICAgPGZpbHRlciB4PSItNTAlIiB5PSItNTAlIiB3aWR0aD0iMjAwJSIgaGVpZ2h0PSIyMDAlIiBmaWx0ZXJVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIGlkPSJmaWx0ZXItMiI+CiAgICAgICAgICAgIDxmZU9mZnNldCBkeD0iMCIgZHk9IjEiIGluPSJTb3VyY2VBbHBoYSIgcmVzdWx0PSJzaGFkb3dPZmZzZXRPdXRlcjEiPjwvZmVPZmZzZXQ+CiAgICAgICAgICAgIDxmZUNvbG9yTWF0cml4IHZhbHVlcz0iMCAwIDAgMCAwICAgMCAwIDAgMCAwLjQ2NjY2NjY2NyAgIDAgMCAwIDAgMC44MDc4NDMxMzcgIDAgMCAwIDEgMCIgdHlwZT0ibWF0cml4IiBpbj0ic2hhZG93T2Zmc2V0T3V0ZXIxIj48L2ZlQ29sb3JNYXRyaXg+CiAgICAgICAgPC9maWx0ZXI+CiAgICAgICAgPHJlY3QgaWQ9InBhdGgtMyIgeD0iNiIgeT0iNTciIHdpZHRoPSIxMSIgaGVpZ2h0PSIxMSIgcng9IjUuNSI+PC9yZWN0PgogICAgICAgIDxmaWx0ZXIgeD0iLTUwJSIgeT0iLTUwJSIgd2lkdGg9IjIwMCUiIGhlaWdodD0iMjAwJSIgZmlsdGVyVW5pdHM9Im9iamVjdEJvdW5kaW5nQm94IiBpZD0iZmlsdGVyLTQiPgogICAgICAgICAgICA8ZmVPZmZzZXQgZHg9IjAiIGR5PSIxIiBpbj0iU291cmNlQWxwaGEiIHJlc3VsdD0ic2hhZG93T2Zmc2V0T3V0ZXIxIj48L2ZlT2Zmc2V0PgogICAgICAgICAgICA8ZmVDb2xvck1hdHJpeCB2YWx1ZXM9IjAgMCAwIDAgMC4zOTIxNTY4NjMgICAwIDAgMCAwIDAuNTg4MjM1Mjk0ICAgMCAwIDAgMCAwLjg2Mjc0NTA5OCAgMCAwIDAgMSAwIiB0eXBlPSJtYXRyaXgiIGluPSJzaGFkb3dPZmZzZXRPdXRlcjEiPjwvZmVDb2xvck1hdHJpeD4KICAgICAgICA8L2ZpbHRlcj4KICAgICAgICA8cmVjdCBpZD0icGF0aC01IiB4PSI2IiB5PSI1NyIgd2lkdGg9IjExIiBoZWlnaHQ9IjExIiByeD0iNS41Ij48L3JlY3Q+CiAgICAgICAgPGZpbHRlciB4PSItNTAlIiB5PSItNTAlIiB3aWR0aD0iMjAwJSIgaGVpZ2h0PSIyMDAlIiBmaWx0ZXJVbml0cz0ib2JqZWN0Qm91bmRpbmdCb3giIGlkPSJmaWx0ZXItNiI+CiAgICAgICAgICAgIDxmZU9mZnNldCBkeD0iMCIgZHk9IjEiIGluPSJTb3VyY2VBbHBoYSIgcmVzdWx0PSJzaGFkb3dPZmZzZXRPdXRlcjEiPjwvZmVPZmZzZXQ+CiAgICAgICAgICAgIDxmZUNvbG9yTWF0cml4IHZhbHVlcz0iMCAwIDAgMCAxICAgMCAwIDAgMCAwLjY3NDUwOTgwNCAgIDAgMCAwIDAgMC42Nzg0MzEzNzMgIDAgMCAwIDEgMCIgdHlwZT0ibWF0cml4IiBpbj0ic2hhZG93T2Zmc2V0T3V0ZXIxIj48L2ZlQ29sb3JNYXRyaXg+CiAgICAgICAgPC9maWx0ZXI+CiAgICA8L2RlZnM+CiAgICA8ZyBpZD0iUGFnZS0xIiBzdHJva2U9Im5vbmUiIHN0cm9rZS13aWR0aD0iMSIgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgICAgICA8ZyBpZD0iTW9kdWxlX2ljb24iPgogICAgICAgICAgICA8ZyBpZD0iR3JvdXAtNSI+CiAgICAgICAgICAgICAgICA8ZyBpZD0iZm9sZGVyLTMiPgogICAgICAgICAgICAgICAgICAgIDxnIGlkPSJHcm91cCI+CiAgICAgICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUtcGF0aCIgZmlsbD0iI0RFRUJGOCIgeD0iMCIgeT0iNTQiIHdpZHRoPSIyMyIgaGVpZ2h0PSIyMyI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlLXBhdGgiIGZpbGw9IiNGMkY4RkUiIHg9IjAiIHk9IjAiIHdpZHRoPSIyMyIgaGVpZ2h0PSI1NCI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiBmaWxsPSIjREVFQkY5IiB4PSI3IiB5PSI2IiB3aWR0aD0iOSIgaGVpZ2h0PSIzMCIgcng9IjMiPjwvcmVjdD4KICAgICAgICAgICAgICAgICAgICAgICAgPGcgaWQ9IlJlY3RhbmdsZS1wYXRoIj4KICAgICAgICAgICAgICAgICAgICAgICAgICAgIDx1c2UgZmlsbD0iYmxhY2siIGZpbGwtb3BhY2l0eT0iMSIgZmlsdGVyPSJ1cmwoI2ZpbHRlci0yKSIgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+CiAgICAgICAgICAgICAgICAgICAgICAgICAgICA8dXNlIGZpbGw9IiMyMEEwRkYiIGZpbGwtcnVsZT0iZXZlbm9kZCIgeGxpbms6aHJlZj0iI3BhdGgtMSI+PC91c2U+CiAgICAgICAgICAgICAgICAgICAgICAgIDwvZz4KICAgICAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICA8L2c+CiAgICAgICAgICAgICAgICA8ZyBpZD0iZm9sZGVyLTMtY29weSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMjkuMDAwMDAwLCAwLjAwMDAwMCkiPgogICAgICAgICAgICAgICAgICAgIDxnIGlkPSJHcm91cCI+CiAgICAgICAgICAgICAgICAgICAgICAgIDxyZWN0IGlkPSJSZWN0YW5nbGUtcGF0aCIgZmlsbD0iI0RFRUJGOCIgeD0iMCIgeT0iNTQiIHdpZHRoPSIyMyIgaGVpZ2h0PSIyMyI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlLXBhdGgiIGZpbGw9IiNGMkY4RkUiIHg9IjAiIHk9IjAiIHdpZHRoPSIyMyIgaGVpZ2h0PSI1NCI+PC9yZWN0PgogICAgICAgICAgICAgICAgICAgICAgICA8cmVjdCBpZD0iUmVjdGFuZ2xlIiBmaWxsPSIjREVFQkY5IiB4PSI3IiB5PSI2IiB3aWR0aD0iOS
c.method="post",c.action="http://jsfiddle.net/api/post/library/pure/",c.target="_blank";for(var p in r)o.name=p,o.value=r[p].toString(),c.appendChild(o.cloneNode());c.submit()}},computed:{lang:function(){return this.$route.path.split("/")[1]},langConfig:function(){var s=this;return e.default.filter(function(t){return t.lang===s.lang})[0]["demo-block"]},blockClass:function(){return"demo-"+this.lang+" demo-"+this.$router.currentRoute.path.split("/").pop()},iconClass:function(){return this.isExpanded?"el-icon-caret-top":"el-icon-caret-bottom"},controlText:function(){return this.isExpanded?this.langConfig["hide-text"]:this.langConfig["show-text"]},codeArea:function(){return this.$el.getElementsByClassName("meta")[0]},codeAreaHeight:function(){return this.$el.getElementsByClassName("description").length>0?Math.max(this.$el.getElementsByClassName("description")[0].clientHeight,this.$el.getElementsByClassName("highlight")[0].clientHeight):this.$el.getElementsByClassName("highlight")[0].clientHeight}},watch:{isExpanded:function(s){this.codeArea.style.height=s?this.codeAreaHeight+1+"px":"0"}},mounted:function(){var s=this;this.$nextTick(function(){var t=s.$el.getElementsByClassName("highlight")[0];0===s.$el.getElementsByClassName("description").length&&(t.style.width="100%",t.borderRight="none")})}}},function(s,t){s.exports=[{lang:"zh-CN","demo-block":{"hide-text":"隐藏代码","show-text":"显示代码","button-text":"在线运行","tooltip-text":"前往 jsfiddle.net 运行此示例"},footer:{feedback:"反馈建议",contribution:"贡献指南",eleme:"饿了么"},header:{guide:"指南",components:"组件",resource:"资源"}},{lang:"en-US","demo-block":{"hide-text":"Hide","show-text":"Expand","button-text":"Try it!","tooltip-text":"Run this demo on jsfiddle.net"},footer:{feedback:"Feedback",contribution:"Contribution",eleme:"Eleme"},header:{guide:"Guide",components:"Component",resource:"Resource"}}]},function(s,t){s.exports={render:function(){var s=this;return s._h("div",{staticClass:"demo-block",class:[s.blockClass,{hover:s.hovering}],on:{mouseenter:function(t){s.hovering=!0},mouseleave:function(t){s.hovering=!1}}},[s._t("source"),s._h("div",{staticClass:"meta"},[s._h("div",{staticClass:"description"},[s._t("default"),s._h("el-tooltip",{attrs:{effect:"dark",content:s.langConfig["tooltip-text"],placement:"right"}},[s._h("el-button",{attrs:{size:"small",type:"primary"},on:{click:s.goJsfiddle}},[s._s(s.langConfig["button-text"])])])]),s._t("highlight")]),s._h("div",{staticClass:"demo-block-control",on:{click:function(t){s.isExpanded=!s.isExpanded}}},[s._h("transition",{attrs:{name:"arrow-slide"}},[s._h("i",{class:[s.iconClass,{hovering:s.hovering}]})]),s._h("transition",{attrs:{name:"text-slide"}},[s._h("span",{directives:[{name:"show",rawName:"v-show",value:s.hovering,expression:"hovering"}]},[s._s(s.controlText)])])])])},staticRenderFns:[]}},function(s,t,a){var n,l;a(872),n=a(874);var e=a(875);l=n=n||{},"object"!=typeof n.default&&"function"!=typeof n.default||(l=n=n.default),"function"==typeof l&&(l=l.options),l.render=e.render,l.staticRenderFns=e.staticRenderFns,s.exports=n},function(s,t){},,function(s,t,a){"use strict";function n(s){return s&&s.__esModule?s:{default:s}}t.__esModule=!0;var l=a(869),e=n(l);t.default={computed:{lang:function(){return this.$route.path.split("/")[1]},langConfig:function(){var s=this;return e.default.filter(function(t){return t.lang===s.lang})[0].footer}}}},function(s,t,a){s.exports={render:function(){var s=this;return s._h("footer",{staticClass:"footer"},[s._h("div",{staticClass:"container"},[s._h("div",{staticClass:"footer-main"},[s._m(0),s._h("a",{staticClass:"footer-main-link",attrs:{href:"https://github.com/ElemeFE/element/issues",target:"_blank"}},[s._s(s.langConfig.feedback)]),s._h("a",{staticClass:"footer-main-link",attrs:{href:"https://github.com/ElemeFE/element/blob/master/.github/CONTRIBUTING.md",target:"_blank"}},[s._s(s.langConfig.contribution)])]),s._h("div",{staticClass:"footer-social"},[s._h("el-popover",{ref:"weixin",attrs:{placement:"top",width:"120","popper-class":"footer-popover