模板版本:v0.2.2
[!TIP] Github 地址
进入到工程目录并输入以下命令:
npm install [email protected]
yarn add [email protected]
下面的代码展示了这个库的基本使用场景:
import sectionListGetItemLayout from "react-native-section-list-get-item-layout";
class MyComponent extends React.Component {
constructor(props) {
super(props);
this.getItemLayout = sectionListGetItemLayout({
// The height of the row with rowData at the given sectionIndex and rowIndex
getItemHeight: (rowData, sectionIndex, rowIndex) =>
sectionIndex === 0 ? 100 : 50,
// These four properties are optional
getSeparatorHeight: () => 1 / PixelRatio.get(), // The height of your separators
getSectionHeaderHeight: () => 20, // The height of your section headers
getSectionFooterHeight: () => 10, // The height of your section footers
listHeaderHeight: 40, // The height of your list header
});
}
render() {
return <SectionList {...otherStuff} getItemLayout={this.getItemLayout} />;
}
}
export default MyComponent
本文档内容基于以下版本验证通过:
- RNOH:0.72.26; SDK:HarmonyOS NEXT Developer Beta1; IDE:DevEco Studio 5.0.3.300; ROM:3.0.0.25;
- RNOH:0.72.33; SDK:OpenHarmony 5.0.0.71(API Version 12 Release); IDE:DevEco Studio 5.0.3.900; ROM:NEXT.0.0.71;
[!TIP] "Platform"列表示该属性在原三方库上支持的平台。
[!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性;no 则表示不支持;partially 表示部分支持。使用方法跨平台一致,效果对标 iOS 或 Android 的效果。
详情见 rn-section-list-get-item-layout 源库地址
Name | Description | Type | Required | Platform | HarmonyOS Support |
---|---|---|---|---|---|
sectionListGetItemLayout({getItemHeight, getSeparatorHeight, getSectionHeaderHeight,getSectionFooterHeight,listHeaderHeight}) | This package provides a function that helps you construct the getItemLayout function for your SectionLists. For an explanation of why this exists, see this post. It's meant to be used like this | function | Yes | All | Yes |
本项目基于 The MIT License (MIT) ,请自由地享受和参与开源。