(window.webpackJsonp=window.webpackJsonp||[]).push([[7],{336:function(t,e,l){var a=l(2),i=l(5),v=l(101),n=[].slice,s=function(t){return function(e,l){var a=arguments.length>2,i=a?n.call(arguments,2):void 0;return t(a?function(){("function"==typeof e?e:Function(e)).apply(this,i)}:e,l)}};a({global:!0,bind:!0,forced:/MSIE .\./.test(v)},{setTimeout:s(i.setTimeout),setInterval:s(i.setInterval)})},337:function(t,e,l){},396:function(t,e,l){"use strict";var a=l(337);l.n(a).a},443:function(t,e,l){"use strict";l.r(e);l(336);var a={data:function(){return{value1:"",value2:[],value3:"",value4:"",options:[1,2,3,4],arr:[]}},mounted:function(){var t=this;setTimeout((function(){var e=0;for(t.arr=[];e<1e4;)t.arr.push({value1:e,text1:"option".concat(e)}),e++}),1e3)},methods:{change:function(t){console.log(t)},search:function(t){var e=this;setTimeout((function(){e.options=[];for(var l=1;l<10;l++)e.options.push(t+"|"+l)}),500)}}},i=(l(396),l(46)),v=Object(i.a)(a,(function(){var t=this,e=t.$createElement,l=t._self._c||e;return l("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[l("h1",{attrs:{id:"select-选择器"}},[l("a",{staticClass:"header-anchor",attrs:{href:"#select-选择器"}},[t._v("#")]),t._v(" Select 选择器")]),t._v(" "),l("h2",{attrs:{id:"概述"}},[l("a",{staticClass:"header-anchor",attrs:{href:"#概述"}},[t._v("#")]),t._v(" 概述")]),t._v(" "),l("p",[t._v("使用模拟的增强下拉选择器来代替浏览器原生的选择器。")]),t._v(" "),l("h2",{attrs:{id:"代码示例"}},[l("a",{staticClass:"header-anchor",attrs:{href:"#代码示例"}},[t._v("#")]),t._v(" 代码示例")]),t._v(" "),l("ClientOnly",[l("row",{staticClass:"ui-select-docs"},[l("cell",{staticClass:"pr-20",attrs:{span:"12"}},[l("componetTemplate",{attrs:{title:"基础用法",template:"ui/templates/select/1.html"},scopedSlots:t._u([{key:"demo",fn:function(){return[l("Wb-select",{model:{value:t.value1,callback:function(e){t.value1=e},expression:"value1"}},[l("wb-option",{attrs:{value:1,label:"北京市"}}),t._v(" "),l("wb-option",{attrs:{value:2}},[t._v("上海市")]),t._v(" "),l("wb-option",{attrs:{value:3,disabled:""}},[t._v("深圳市")]),t._v(" "),l("wb-option",{attrs:{value:4}},[t._v("杭州市")]),t._v(" "),l("wb-option",{attrs:{value:5}},[t._v("南京市")]),t._v(" "),l("wb-option",{attrs:{value:6}},[t._v("重庆市")])],1)]},proxy:!0},{key:"description",fn:function(){return[l("p",[t._v("Wb-select内部嵌套Wb-option使用，类似原生select内部嵌套option")]),t._v(" "),l("p",[t._v("Wb-selec默认宽度是100%")]),t._v(" "),l("p",[t._v("设置Wb-option为disabled表示禁用此选项")]),t._v(" "),l("p",[t._v("当选择一项时触发on-change事件")])]},proxy:!0}])}),t._v(" "),l("componetTemplate",{attrs:{title:"多选",template:"ui/templates/select/2.html"},scopedSlots:t._u([{key:"demo",fn:function(){return[l("Wb-select",{attrs:{multiple:"","multiple-limit":2},model:{value:t.value2,callback:function(e){t.value2=e},expression:"value2"}},[l("wb-option",{attrs:{value:1,label:"北京市"}}),t._v(" "),l("wb-option",{attrs:{value:2}},[t._v("上海市")]),t._v(" "),l("wb-option",{attrs:{value:3}},[t._v("深圳市")]),t._v(" "),l("wb-option",{attrs:{value:4}},[t._v("杭州市")]),t._v(" "),l("wb-option",{attrs:{value:5}},[t._v("南京市")]),t._v(" "),l("wb-option",{attrs:{value:6}},[t._v("重庆市")])],1)]},proxy:!0},{key:"description",fn:function(){return[l("p",[t._v("添加multiple属性，value值必须是数组")]),t._v(" "),l("p",[t._v("可以通过multipleLimit属性来控制最多选择几个，默认为0")])]},proxy:!0}])})],1),t._v(" "),l("cell",{staticClass:"pl-20",attrs:{span:"12"}},[l("componetTemplate",{attrs:{title:"可搜索",template:"ui/templates/select/3.html"},scopedSlots:t._u([{key:"demo",fn:function(){return[l("Wb-select",{attrs:{filterable:""},model:{value:t.value3,callback:function(e){t.value3=e},expression:"value3"}},[l("wb-option",{attrs:{value:1}},[t._v("北京市")]),t._v(" "),l("wb-option",{attrs:{value:2}},[t._v("上海市")]),t._v(" "),l("wb-option",{attrs:{value:3}},[t._v("深圳市")]),t._v(" "),l("wb-option",{attrs:{value:4}},[t._v("杭州市")]),t._v(" "),l("wb-option",{attrs:{value:5}},[t._v("南京市")]),t._v(" "),l("wb-option",{attrs:{value:6}},[t._v("重庆市")])],1),t._v(" "),l("Wb-select",{attrs:{filterable:""},on:{"on-search":t.search},model:{value:t.value3,callback:function(e){t.value3=e},expression:"value3"}},t._l(t.options,(function(e){return l("wb-option",{key:e,attrs:{value:e}},[t._v(t._s(e))])})),1)]},proxy:!0},{key:"description",fn:function(){return[l("p",[t._v("设置filterable属性，则选项可以根据输入的内容筛选。")]),t._v(" "),l("p",[t._v("通过on-search监听输入的内容，在回调更新option选项数据")])]},proxy:!0}])}),t._v(" "),l("componetTemplate",{attrs:{title:"高性能",template:"ui/templates/select/4.html"},scopedSlots:t._u([{key:"demo",fn:function(){return[l("Wb-select",{attrs:{options:t.arr,"options-value-name":"value1","options-text-name":"text1",filterable:""},on:{"on-change":t.change},model:{value:t.value4,callback:function(e){t.value4=e},expression:"value4"}})]},proxy:!0},{key:"description",fn:function(){return[l("p",[t._v("将列表数据通过options传入，可以达到高性能，渲染1万+的数据也不卡")]),t._v(" "),l("p",[t._v("optionsValueName配置传入数据中value的字段名")]),t._v(" "),l("p",[t._v("optionsTextName配置传入数据中text的字段名")])]},proxy:!0}])})],1)],1)],1),t._v(" "),l("h2",{attrs:{id:"api"}},[l("a",{staticClass:"header-anchor",attrs:{href:"#api"}},[t._v("#")]),t._v(" API")]),t._v(" "),l("h3",{attrs:{id:"select-props"}},[l("a",{staticClass:"header-anchor",attrs:{href:"#select-props"}},[t._v("#")]),t._v(" Select Props")]),t._v(" "),l("table",[l("thead",[l("tr",[l("th",{staticStyle:{"text-align":"left"}},[t._v("属性")]),t._v(" "),l("th",{staticStyle:{"text-align":"left"}},[t._v("说明")]),t._v(" "),l("th",{staticStyle:{"text-align":"left"}},[t._v("类型")]),t._v(" "),l("th",{staticStyle:{"text-align":"left"}},[t._v("默认值")])])]),t._v(" "),l("tbody",[l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("value")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("输入的值, 可以使用v-model实现数据的双向绑定")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Number, String, File")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("''")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("placeholder")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("提示语")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("''")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("disabled")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("是否禁止输入")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("false")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("readonly")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("是否只读")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("false")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("clearable")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("是否显示清空按钮")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("false")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("filterable")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("是否可筛选")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("false")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("multiple")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("是否多选")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("false")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("multipleLimit")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("仅多选时使用，限制选择数，默认值0不限制选择个数")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Number")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("0")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("options")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("配置选项的数据")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Array")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("null")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("optionsValueName")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("指定选项对象的那个字段为值")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("'value'")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("optionsTextName")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("指定选项对象的那个字段为text")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("'text'")])])])]),t._v(" "),l("h3",{attrs:{id:"select-events"}},[l("a",{staticClass:"header-anchor",attrs:{href:"#select-events"}},[t._v("#")]),t._v(" Select Events")]),t._v(" "),l("table",[l("thead",[l("tr",[l("th",{staticStyle:{"text-align":"left"}},[t._v("事件名")]),t._v(" "),l("th",{staticStyle:{"text-align":"left"}},[t._v("说明")]),t._v(" "),l("th",{staticStyle:{"text-align":"left"}},[t._v("返回值")])])]),t._v(" "),l("tbody",[l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("on-search")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("当设置filterable为true，输入过滤条件时触发。连续输入不触发，自带200毫秒的debounce")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("(value, event) => void")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("on-change")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("值改变时触发")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("(value, event) => void")])])])]),t._v(" "),l("h3",{attrs:{id:"option-props"}},[l("a",{staticClass:"header-anchor",attrs:{href:"#option-props"}},[t._v("#")]),t._v(" Option Props")]),t._v(" "),l("table",[l("thead",[l("tr",[l("th",{staticStyle:{"text-align":"left"}},[t._v("属性")]),t._v(" "),l("th",{staticStyle:{"text-align":"left"}},[t._v("说明")]),t._v(" "),l("th",{staticStyle:{"text-align":"left"}},[t._v("类型")]),t._v(" "),l("th",{staticStyle:{"text-align":"left"}},[t._v("默认值")])])]),t._v(" "),l("tbody",[l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("value")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("选项的值")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Number, String")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("''")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("label")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("选项的内容")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("String")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("''")])]),t._v(" "),l("tr",[l("td",{staticStyle:{"text-align":"left"}},[t._v("disabled")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("是否禁止选中")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("Boolean")]),t._v(" "),l("td",{staticStyle:{"text-align":"left"}},[t._v("false")])])])])],1)}),[],!1,null,null,null);e.default=v.exports}}]);