webpackJsonp([26],{BfAM:function(s,t,a){var n=a("VU/8")(null,a("JtsV"),null,null,null);s.exports=n.exports},JtsV:function(s,t){s.exports={render:function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("section",[a("h2",{attrs:{id:"IndexList"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-IndexList-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("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"}})])]),s._v(" IndexList")]),s._v(" "),s._m(0),s._v(" "),a("h3",{attrs:{id:"示例"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-示例-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("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"}})])]),s._v(" 示例")]),s._v(" "),s._m(1),s._v(" "),a("h3",{attrs:{id:"Props配置"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-Props配置-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("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"}})])]),s._v(" Props 配置")]),s._v(" "),s._m(2),s._v(" "),s._m(3),s._v(" "),s._m(4),s._v(" "),s._m(5),s._v(" "),s._m(6),s._v(" "),a("h3",{attrs:{id:"事件"}},[a("a",{staticClass:"anchor",attrs:{href:"#cube-事件-anchor","aria-hidden":"true"}},[a("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[a("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"}})])]),s._v(" 事件")]),s._v(" "),s._m(7)])},staticRenderFns:[function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[s._v("索引列表，提供了列表索引的功能，也是一个基于"),a("code",{pre:!0},[s._v("better-scroll")]),s._v("进行封装的组件。")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("p",[s._v("基本使用")]),s._v(" "),a("p",[s._v("构造如示例中 "),a("code",{pre:!0},[s._v("cityData")]),s._v(" 这样结构的数据，传入 "),a("code",{pre:!0},[s._v("cube-index-list")]),s._v(" 组件的 "),a("code",{pre:!0},[s._v("data")]),s._v(" 属性。")]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-index-list")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":data")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"cityData"')]),s._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":title")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"title"')]),s._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@select")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"selectItem"')]),s._v("\n  "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@title-click")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"clickTitle"')]),s._v(">")]),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-index-list")]),s._v(">")]),s._v("\n")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" cityData = [\n  {\n    "),a("span",{attrs:{class:"hljs-string"}},[s._v('"name"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"★Hot City"')]),s._v(",\n    "),a("span",{attrs:{class:"hljs-string"}},[s._v('"items"')]),s._v(": [\n      {\n        "),a("span",{attrs:{class:"hljs-string"}},[s._v('"name"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"BEIJING"')]),s._v(",\n        "),a("span",{attrs:{class:"hljs-string"}},[s._v('"value"')]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("1")]),s._v("\n      },\n      {\n        "),a("span",{attrs:{class:"hljs-string"}},[s._v('"name"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"SHANGHAI"')]),s._v(",\n        "),a("span",{attrs:{class:"hljs-string"}},[s._v('"value"')]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("2")]),s._v("\n      }\n    ]\n  },\n  {\n    "),a("span",{attrs:{class:"hljs-string"}},[s._v('"name"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"A"')]),s._v(",\n    "),a("span",{attrs:{class:"hljs-string"}},[s._v('"items"')]),s._v(": [\n      {\n        "),a("span",{attrs:{class:"hljs-string"}},[s._v('"name"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"ANSHAN"')]),s._v(",\n        "),a("span",{attrs:{class:"hljs-string"}},[s._v('"value"')]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("3")]),s._v("\n      },\n      {\n        "),a("span",{attrs:{class:"hljs-string"}},[s._v('"name"')]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v('"ANQING"')]),s._v(",\n        "),a("span",{attrs:{class:"hljs-string"}},[s._v('"value"')]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("4")]),s._v("\n      }\n    ]\n  }\n]\n\n"),a("span",{attrs:{class:"hljs-keyword"}},[s._v("export")]),s._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("default")]),s._v(" {\n  data() {\n    "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n      "),a("span",{attrs:{class:"hljs-attr"}},[s._v("title")]),s._v(": "),a("span",{attrs:{class:"hljs-string"}},[s._v("'Current City: BEIJING'")]),s._v(",\n      "),a("span",{attrs:{class:"hljs-attr"}},[s._v("cityData")]),s._v(": cityData\n    }\n  },\n  "),a("span",{attrs:{class:"hljs-attr"}},[s._v("methods")]),s._v(": {\n    selectItem(item) {\n      "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("console")]),s._v(".log(item.name)\n    },\n    clickTitle(title) {\n      "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("console")]),s._v(".log(title)\n    }\n  }\n}\n")])])]),s._v(" "),a("li",[a("p",[s._v("自定义插槽")]),s._v(" "),a("p",[s._v("除了默认结构，你还可以根据自己的需要自定义每一项的内容。如下所示，将你的自定义内容项填入"),a("code",{pre:!0},[s._v("cube-index-list-item")]),s._v("的插槽。除非你真的知道自己在做什么，否则不要修改"),a("code",{pre:!0},[s._v("cube-index-list-group")]),s._v("和"),a("code",{pre:!0},[s._v("cube-index-list-item")]),s._v("的用法。")]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-html"}},[a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-index-list")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":data")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"cityData"')]),s._v(">")]),s._v("\n  "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-index-list-group")]),s._v("\n    "),a("span",{attrs:{class:"hljs-attr"}},[s._v("v-for")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"(group, index) in cityData"')]),s._v("\n    "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":key")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"index"')]),s._v("\n    "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":group")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"group"')]),s._v(">")]),s._v("\n    "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-index-list-item")]),s._v("\n      "),a("span",{attrs:{class:"hljs-attr"}},[s._v("v-for")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"(item, index) in group.items"')]),s._v("\n      "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":key")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"index"')]),s._v("\n      "),a("span",{attrs:{class:"hljs-attr"}},[s._v(":item")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"item"')]),s._v("\n      "),a("span",{attrs:{class:"hljs-attr"}},[s._v("@select")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"selectItem"')]),s._v(">")]),s._v("\n      "),a("span",{attrs:{class:"hljs-tag"}},[s._v("<"),a("span",{attrs:{class:"hljs-name"}},[s._v("div")]),s._v(" "),a("span",{attrs:{class:"hljs-attr"}},[s._v("class")]),s._v("="),a("span",{attrs:{class:"hljs-string"}},[s._v('"custom-item"')]),s._v(">")]),s._v("我是自定义 {{item.name}}"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("div")]),s._v(">")]),s._v("\n    "),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-index-list-item")]),s._v(">")]),s._v("\n  "),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-index-list-group")]),s._v(">")]),s._v("\n"),a("span",{attrs:{class:"hljs-tag"}},[s._v("</"),a("span",{attrs:{class:"hljs-name"}},[s._v("cube-index-list")]),s._v(">")]),s._v("\n")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-javascript"}},[a("span",{attrs:{class:"hljs-keyword"}},[s._v("export")]),s._v(" "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("default")]),s._v(" {\n  data() {\n    "),a("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n      "),a("span",{attrs:{class:"hljs-attr"}},[s._v("cityData")]),s._v(": cityData\n    }\n  },\n  "),a("span",{attrs:{class:"hljs-attr"}},[s._v("methods")]),s._v(": {\n    selectItem(item) {\n      "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("console")]),s._v(".log(item.name)\n    },\n    clickTitle(title) {\n      "),a("span",{attrs:{class:"hljs-built_in"}},[s._v("console")]),s._v(".log(title)\n    }\n  }\n}\n")])]),s._v(" "),a("pre",{pre:!0},[a("code",{attrs:{"v-pre":"",class:"language-stylus"}},[a("span",{attrs:{class:"hljs-comment"}},[s._v("// 自定义项的样式")]),s._v("\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".custom-item")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("position")]),s._v(": relative\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("70px")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("line-height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("70px")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("padding")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" "),a("span",{attrs:{class:"hljs-number"}},[s._v("16px")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("font-size")]),s._v(": "),a("span",{attrs:{class:"hljs-variable"}},[s._v("$fontsize")]),s._v("-medium\n\n"),a("span",{attrs:{class:"hljs-comment"}},[s._v("// 用自定义样式，覆写内置的默认样式")]),s._v("\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".cube-index-list-content")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("background-color")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("#222")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("#909090")]),s._v("\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".cube-index-list-anchor")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("background-color")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("#333")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("30px")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("line-height")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("30px")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("padding")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" "),a("span",{attrs:{class:"hljs-number"}},[s._v("20px")]),s._v("\n"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".cube-index-list-nav")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("padding")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("20px")]),s._v(" "),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("border-radius")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("10px")]),s._v("\n  "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("background")]),s._v(": rgba("),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(","),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(","),a("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(",."),a("span",{attrs:{class:"hljs-number"}},[s._v("3")]),s._v(")\n  >"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("ul")]),s._v("\n    >"),a("span",{attrs:{class:"hljs-selector-tag"}},[s._v("li")]),s._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("padding")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("3px")]),s._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("font-size")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("12px")]),s._v("\n      "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("#909090")]),s._v("\n      &"),a("span",{attrs:{class:"hljs-selector-class"}},[s._v(".active")]),s._v("\n        "),a("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(": "),a("span",{attrs:{class:"hljs-number"}},[s._v("#ffcd32")]),s._v("\n")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("table",[a("thead",[a("tr",[a("th",[s._v("参数")]),s._v(" "),a("th",[s._v("说明")]),s._v(" "),a("th",[s._v("类型")]),s._v(" "),a("th",[s._v("默认值")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("title")]),s._v(" "),a("td",[s._v("标题")]),s._v(" "),a("td",[s._v("String")]),s._v(" "),a("td",[s._v("-")])]),s._v(" "),a("tr",[a("td",[s._v("data")]),s._v(" "),a("td",[s._v("需要展示的数据")]),s._v(" "),a("td",[s._v("Array")]),s._v(" "),a("td",[s._v("[]")])]),s._v(" "),a("tr",[a("td",[s._v("navbar")]),s._v(" "),a("td",[s._v("是否需要导航栏")]),s._v(" "),a("td",[s._v("Boolean")]),s._v(" "),a("td",[s._v("true")])]),s._v(" "),a("tr",[a("td",[s._v("speed")]),s._v(" "),a("td",[s._v("点击导航栏索引时，滚动到相应位置的动画时间（单位：ms）")]),s._v(" "),a("td",[s._v("number")]),s._v(" "),a("td",[s._v("0")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("ul",[a("li",[a("code",{pre:!0},[s._v("data")]),s._v(" 子配置项")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[a("code",{pre:!0},[s._v("data")]),s._v(" 是数组，表示的是一组数据，每一项配置：")])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("table",[a("thead",[a("tr",[a("th",[s._v("参数")]),s._v(" "),a("th",[s._v("说明")]),s._v(" "),a("th",[s._v("类型")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("name")]),s._v(" "),a("td",[s._v("组名")]),s._v(" "),a("td",[s._v("String")])]),s._v(" "),a("tr",[a("td",[s._v("items")]),s._v(" "),a("td",[s._v("当前组下的数据项")]),s._v(" "),a("td",[s._v("Array")])])])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("p",[a("code",{pre:!0},[s._v("items")]),s._v(" 数组中的每一项必须是对象，且包含 "),a("code",{pre:!0},[s._v("name")]),s._v(" 属性用于显示内容；例如 "),a("code",{pre:!0},[s._v("items")]),s._v(": "),a("code",{pre:!0},[s._v("[{name: 'xx', ...}, ...]")])])},function(){var s=this,t=s.$createElement,a=s._self._c||t;return a("table",[a("thead",[a("tr",[a("th",[s._v("事件名")]),s._v(" "),a("th",[s._v("说明")]),s._v(" "),a("th",[s._v("参数")])])]),s._v(" "),a("tbody",[a("tr",[a("td",[s._v("select")]),s._v(" "),a("td",[s._v("点击 IndexList 的某一项后触发")]),s._v(" "),a("td",[s._v("该选项的数据")])]),s._v(" "),a("tr",[a("td",[s._v("title-click")]),s._v(" "),a("td",[s._v("点击 title 后触发(title 必须设置后才有效)")]),s._v(" "),a("td",[s._v("title属性值")])])])])}]}},hUpT:function(s,t,a){s.exports=a("BfAM")}});