Mind UI

# Index 索引

# 介绍

索引列表，可由右侧索引导航快速定位到相应的内容。

# 引入

"usingComponents": {
	"m-index-group": "/dist/index-group/index",
	"m-index": "/dist/index/index"
}

# 用法

<m-index bind:change="onChange">
  <m-index-item name="A">
  	<view>文本</view>
  	<view>文本</view>
  	<view>文本</view>
  	<view>文本</view>
  	<view>文本</view>
  </m-index-item>

  <m-index-item name="B">
  	<view>文本</view>
  	<view>文本</view>
  	<view>文本</view>
  	<view>文本</view>
  	<view>文本</view>
  </m-index-item>

  <m-index-item name="C">
  	<view>文本</view>
  	<view>文本</view>
  	<view>文本</view>
  	<view>文本</view>
  	<view>文本</view>
  </m-index-item>
</m-index>

Page({
	// 索引字符选中更新时触发，detail 为选中的字符
	onChange({ detail }) {
		console.log(detail)
	}
})

# group properties

参数 说明 类型 可选值 默认值
custom-class 自定义根节点样式类 String — —

# event

事件名称 说明 返回值
bind:change 选中索引值发生变化时的回调函数 event.detail: 新选中的值

# properties

参数 说明 类型 可选值 默认值
name 索引的名称，会转化到索引列中 String — —
custom-class 自定义 name 区域的样式类 String — —

# Slot

名称 说明
- 索引对应的内容

← StickyButton 粘滞按钮 →