indexList
功能描述
indexList是基于原生js的索引列表组件,仅4kb,支持定制
依赖模块
无
快速使用
<div class="indexlist">
<ul class="indexlist-content">
</ul>
<div class="indexlist-nav">
<ul class="indexlist-navlist">
</ul>
</div>
<div class="indexlist-indicator" style="display: none;" id="indicator"></div>
</div>
new IndexList({
el: document.querySelector('.indexlist'),
data: D.data,
indexRender: function (index) {
return '<p class="indexsection-index">' + index + '</p>';
},
itemRender: function (index, item) {
return '<a class="cell"><div class="cell-wrapper"><div class="cell-title"><span class="cell-text">' + item + '</span></div></div></a>'
}
})
配置项
el
- 类型:HTMLElement
- 默认值:null
- 作用:内容区
- 是否必传:是
data
- 类型:Array
- 默认值:null
- 作用:索引列表数据
- 是否必传:是
- 参考:
[ { index: 'A', items: ['Aaron', 'Alden', 'Austin'] }, { index: 'B', items: ['Baldwin', 'Braden'] } ]
indexRender
- 类型:Function
- 作用:索引渲染函数
- 是否必传:否
itemRender
- 类型:Function
- 作用:项渲染函数
- 是否必传:否