通过折叠面板收纳内容区域

#平台差异说明

App（vue）	App（nvue）	H5	小程序
√	√	√	√

#基本使用

外层包裹一个index-list组件，锚点通过index-anchor组件传入，自定义列表内容通过index-item嵌套使用

• nvue需要将index-anchor写在index-item的外部
• 非nvue需要将index-anchor嵌套在index-item的内部
• 可以通过index-list参数自定义索引字符列表
• 需要监听页面的onPageScroll事件，将当前滚动条高度传入index-list组件

<template><u-index-list :index-list="indexList"><template v-for="(item, index) in itemArr"><!-- #ifdef APP-NVUE --><u-index-anchor :text="indexList[index]"></u-index-anchor><!-- #endif --><u-index-item><!-- #ifndef APP-NVUE --><u-index-anchor :text="indexList[index]"></u-index-anchor><!-- #endif --><view class="list-cell" v-for="(cell, index) in item">{{cell}}</view></u-index-item></template></u-index-list>
</template><script>export default {data() {return {indexList: ["A", "B", "C"],itemArr: [['列表A1','列表A2','列表A3'],['列表B1','列表B2','列表B3'],['列表C1','列表C2','列表C3']]}}}
</script><style lang="scss" scoped>.list-cell {display: flex;box-sizing: border-box;width: 100%;padding: 10px 24rpx;overflow: hidden;color: #323233;font-size: 14px;line-height: 24px;background-color: #fff;}
</style>