Skip to content

一个基于React的IndexBar组件;用于数据的序列号展示,常见应用为右侧索引栏、通讯录字母索引等

License

Notifications You must be signed in to change notification settings

sorryljt/IndexBar-react

Repository files navigation

IndexBar-React

NPM version NPM downloads NPM downloads

一个基于 React 的 IndexBar 组件;用于数据的序列号展示,常见应用为右侧索引栏、通讯录字母索引等。文档实例

image

开始使用

安装

npm i indexbar-react -S
# or
yarn add indexbar-react -S

属性

Indexbar

组件外层容器

属性名 说明 类型 默认值
indexs 右侧索引菜单数据 string[] []

Indexbar-Panel

分组标题列表

属性名 说明 类型 默认值
index 该分组属于哪个索引,取上方 indexs 中的每一项,用于列表分类 string
title 每个分组的标题 string
children 每一项的列表渲染内容,可根据需要自定义渲染逻辑 React.ReactNode

常见问题(Q&A)

  • 需控制组件容器为滚动区域,否则滚动失效;正确做法为下方 demo 中,给content元素设置为滚动区域
  • 列表内容为业务数据,需要根据需求自己渲染,本组件只提供索引定位能力

LICENSE

MIT

About

一个基于React的IndexBar组件;用于数据的序列号展示,常见应用为右侧索引栏、通讯录字母索引等

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published