前往新版Gitcode，体验更适合开发者的 AI 搜索 >>
webpackJsonp([17],{Arul:function(t,s,v){var a=v("VU/8")(null,v("pVIV"),null,null,null);t.exports=a.exports},eM4Z:function(t,s,v){t.exports=v("Arul")},pVIV:function(t,s){t.exports={render:function(){var t=this,s=t.$createElement,v=t._self._c||s;return v("section",[v("h2",{attrs:{id:"Select"}},[v("a",{staticClass:"anchor",attrs:{href:"#cube-Select-anchor","aria-hidden":"true"}},[v("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[v("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),t._v(" Select")]),t._v(" "),t._m(0),t._v(" "),v("p",[t._v("Select 组件，用于单项选择。")]),t._v(" "),t._m(1),t._v(" "),v("h3",{attrs:{id:"示例"}},[v("a",{staticClass:"anchor",attrs:{href:"#cube-示例-anchor","aria-hidden":"true"}},[v("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[v("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),t._v(" 示例")]),t._v(" "),t._m(2),t._v(" "),v("h3",{attrs:{id:"Props配置"}},[v("a",{staticClass:"anchor",attrs:{href:"#cube-Props配置-anchor","aria-hidden":"true"}},[v("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[v("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),t._v(" Props 配置")]),t._v(" "),t._m(3),t._v(" "),t._m(4),t._v(" "),t._m(5),t._v(" "),v("p",[t._v("你可以将每个选项定义成一个对象，其中 text 为选项文案，value为选项的值，若没有将该选项定义为对象，比如 2014，则我们内部会把它转化成 { value: 2014, text: 2014 }")]),t._v(" "),v("h3",{attrs:{id:"事件"}},[v("a",{staticClass:"anchor",attrs:{href:"#cube-事件-anchor","aria-hidden":"true"}},[v("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[v("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),t._v(" 事件")]),t._v(" "),t._m(6)])},staticRenderFns:[function(){var t=this,s=t.$createElement,v=t._self._c||s;return v("blockquote",[v("p",[t._v("1.5.0 新增")])])},function(){var t=this,s=t.$createElement,v=t._self._c||s;return v("p",[v("strong",[t._v("注：")]),t._v(" 由于此组件依赖 "),v("a",{attrs:{href:"#/zh-CN/docs/picker"}},[t._v("Picker")]),t._v(" 组件，而 Picker 组件是基于 create-api 实现，所以在使用之前，请确保自己了解过 "),v("a",{attrs:{href:"#/zh-CN/docs/create-api"}},[t._v("create-api")]),t._v("。")])},function(){var t=this,s=t.$createElement,v=t._self._c||s;return v("ul",[v("li",[v("p",[t._v("基本用法")]),t._v(" "),v("p",[t._v("对于 Select 选择组件，你需要传入 options 定义各个选项，选择的结果则绑定在 v-model 上。")]),t._v(" "),v("pre",{pre:!0},[v("code",{attrs:{"v-pre":"",class:"language-html"}},[v("span",{attrs:{class:"hljs-tag"}},[t._v("<"),v("span",{attrs:{class:"hljs-name"}},[t._v("cube-select")]),t._v("\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("v-model")]),t._v("="),v("span",{attrs:{class:"hljs-string"}},[t._v('"value"')]),t._v("\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v(":options")]),t._v("="),v("span",{attrs:{class:"hljs-string"}},[t._v('"options"')]),t._v(">")]),t._v("\n"),v("span",{attrs:{class:"hljs-tag"}},[t._v("</"),v("span",{attrs:{class:"hljs-name"}},[t._v("cube-select")]),t._v(">")]),t._v("\n")])]),t._v(" "),v("pre",{pre:!0},[v("code",{attrs:{"v-pre":"",class:"language-js"}},[v("span",{attrs:{class:"hljs-keyword"}},[t._v("export")]),t._v(" "),v("span",{attrs:{class:"hljs-keyword"}},[t._v("default")]),t._v(" {\n data() {\n "),v("span",{attrs:{class:"hljs-keyword"}},[t._v("return")]),t._v(" {\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("options")]),t._v(": ["),v("span",{attrs:{class:"hljs-number"}},[t._v("2013")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2014")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2015")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2016")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2017")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2018")]),t._v("],\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("value")]),t._v(": "),v("span",{attrs:{class:"hljs-number"}},[t._v("2016")]),t._v("\n }\n }\n}\n")])])]),t._v(" "),v("li",[v("p",[t._v("配置和事件")]),t._v(" "),v("p",[t._v("Select 支持选择器标题（title）、占位符（placeholder）、自动弹出选择器（autoPop）、禁用（disabled）的配置。并且在选择时，如果选择的值改变了，会派发 change 事件。")]),t._v(" "),v("pre",{pre:!0},[v("code",{attrs:{"v-pre":"",class:"language-html"}},[v("span",{attrs:{class:"hljs-tag"}},[t._v("<"),v("span",{attrs:{class:"hljs-name"}},[t._v("cube-select")]),t._v("\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("v-model")]),t._v("="),v("span",{attrs:{class:"hljs-string"}},[t._v('"value"')]),t._v("\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v(":title")]),t._v("="),v("span",{attrs:{class:"hljs-string"}},[t._v('"title"')]),t._v("\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v(":options")]),t._v("="),v("span",{attrs:{class:"hljs-string"}},[t._v('"options"')]),t._v("\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v(":placeholder")]),t._v("="),v("span",{attrs:{class:"hljs-string"}},[t._v('"placeholder"')]),t._v("\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v(":auto-pop")]),t._v("="),v("span",{attrs:{class:"hljs-string"}},[t._v('"autoPop"')]),t._v("\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v(":disabled")]),t._v("="),v("span",{attrs:{class:"hljs-string"}},[t._v('"disabled"')]),t._v("\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("@change")]),t._v("="),v("span",{attrs:{class:"hljs-string"}},[t._v('"change"')]),t._v(">")]),t._v("\n"),v("span",{attrs:{class:"hljs-tag"}},[t._v("</"),v("span",{attrs:{class:"hljs-name"}},[t._v("cube-select")]),t._v(">")]),t._v("\n")])]),t._v(" "),v("pre",{pre:!0},[v("code",{attrs:{"v-pre":"",class:"language-js"}},[v("span",{attrs:{class:"hljs-keyword"}},[t._v("export")]),t._v(" "),v("span",{attrs:{class:"hljs-keyword"}},[t._v("default")]),t._v(" {\n data() {\n "),v("span",{attrs:{class:"hljs-keyword"}},[t._v("return")]),t._v(" {\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("options")]),t._v(": ["),v("span",{attrs:{class:"hljs-number"}},[t._v("2013")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2014")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2015")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2016")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2017")]),t._v(", "),v("span",{attrs:{class:"hljs-number"}},[t._v("2018")]),t._v("],\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("value")]),t._v(": "),v("span",{attrs:{class:"hljs-number"}},[t._v("2016")]),t._v(",\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("title")]),t._v(": "),v("span",{attrs:{class:"hljs-string"}},[t._v("'入职时间'")]),t._v(",\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("placeholder")]),t._v(": "),v("span",{attrs:{class:"hljs-string"}},[t._v("'请选择入职时间'")]),t._v(",\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("autoPop")]),t._v(": "),v("span",{attrs:{class:"hljs-literal"}},[t._v("false")]),t._v(",\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("disabled")]),t._v(": "),v("span",{attrs:{class:"hljs-literal"}},[t._v("false")]),t._v("\n }\n },\n "),v("span",{attrs:{class:"hljs-attr"}},[t._v("methods")]),t._v(": {\n change(value, index, text) {\n "),v("span",{attrs:{class:"hljs-built_in"}},[t._v("console")]),t._v(".log("),v("span",{attrs:{class:"hljs-string"}},[t._v("'change'")]),t._v(", value, index, text)\n }\n }\n}\n")])]),t._v(" "),v("p",[t._v("需要注意的一点是，change 事件在你直接赋值修改 value 的值时，不会触发，只会在选择导致的修改时触发。如果你只是想监听 value 的改变，请直接监听 value。")])])])},function(){var t=this,s=t.$createElement,v=t._self._c||s;return v("table",[v("thead",[v("tr",[v("th",[t._v("参数")]),t._v(" "),v("th",[t._v("说明")]),t._v(" "),v("th",[t._v("类型")]),t._v(" "),v("th",[t._v("可选值")]),t._v(" "),v("th",[t._v("默认值")])])]),t._v(" "),v("tbody",[v("tr",[v("td",[t._v("options")]),t._v(" "),v("td",[t._v("选项")]),t._v(" "),v("td",[t._v("Array")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("[]")])]),t._v(" "),v("tr",[v("td",[t._v("v-model")]),t._v(" "),v("td",[t._v("选中的值")]),t._v(" "),v("td",[t._v("Any")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("-")])]),t._v(" "),v("tr",[v("td",[t._v("placeholder")]),t._v(" "),v("td",[t._v("占位文案")]),t._v(" "),v("td",[t._v("String")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("'请选择'")])]),t._v(" "),v("tr",[v("td",[t._v("autoPop")]),t._v(" "),v("td",[t._v("是否自动弹出选择器")]),t._v(" "),v("td",[t._v("Boolean")]),t._v(" "),v("td",[t._v("true/false")]),t._v(" "),v("td",[t._v("false")])]),t._v(" "),v("tr",[v("td",[t._v("disabled")]),t._v(" "),v("td",[t._v("是否禁用")]),t._v(" "),v("td",[t._v("Boolean")]),t._v(" "),v("td",[t._v("true/false")]),t._v(" "),v("td",[t._v("false")])]),t._v(" "),v("tr",[v("td",[t._v("title")]),t._v(" "),v("td",[t._v("选择器的标题")]),t._v(" "),v("td",[t._v("String")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("'请选择'")])]),t._v(" "),v("tr",[v("td",[t._v("cancelTxt")]),t._v(" "),v("td",[t._v("选择器的取消按钮文案")]),t._v(" "),v("td",[t._v("String")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("'取消'")])]),t._v(" "),v("tr",[v("td",[t._v("confirmTxt")]),t._v(" "),v("td",[t._v("选择器的确认按钮文案")]),t._v(" "),v("td",[t._v("String")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("'确认'")])])])])},function(){var t=this,s=t.$createElement,v=t._self._c||s;return v("ul",[v("li",[v("code",{pre:!0},[t._v("options")]),t._v(" 子配置项")])])},function(){var t=this,s=t.$createElement,v=t._self._c||s;return v("table",[v("thead",[v("tr",[v("th",[t._v("参数")]),t._v(" "),v("th",[t._v("说明")]),t._v(" "),v("th",[t._v("类型")]),t._v(" "),v("th",[t._v("可选值")]),t._v(" "),v("th",[t._v("示例")])])]),t._v(" "),v("tbody",[v("tr",[v("td",[t._v("value")]),t._v(" "),v("td",[t._v("该选项的值")]),t._v(" "),v("td",[t._v("Any")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("-")])]),t._v(" "),v("tr",[v("td",[t._v("text")]),t._v(" "),v("td",[t._v("该选项的文案")]),t._v(" "),v("td",[t._v("String")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("-")])])])])},function(){var t=this,s=t.$createElement,v=t._self._c||s;return v("table",[v("thead",[v("tr",[v("th",[t._v("事件名")]),t._v(" "),v("th",[t._v("说明")]),t._v(" "),v("th",[t._v("参数1")]),t._v(" "),v("th",[t._v("参数2")]),t._v(" "),v("th",[t._v("参数3")])])]),t._v(" "),v("tbody",[v("tr",[v("td",[t._v("change")]),t._v(" "),v("td",[t._v("在选择时，如果选择的值改变了派发")]),t._v(" "),v("td",[t._v("选中项的值")]),t._v(" "),v("td",[t._v("选中项的索引")]),t._v(" "),v("td",[t._v("选中项的文案")])]),t._v(" "),v("tr",[v("td",[t._v("picker-show")]),t._v(" "),v("td",[t._v("使用的 Picker 显示的时候派发")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("-")])]),t._v(" "),v("tr",[v("td",[t._v("picker-hide")]),t._v(" "),v("td",[t._v("使用的 Picker 隐藏的时候派发（确定或取消都会派发）")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("-")]),t._v(" "),v("td",[t._v("-")])])])])}]}}});
