それが私のせいなのか、それとも正しい動作なのか判断できない問題に直面しています。
次のような構造を持つ React Native の SectionList コンポーネントを使用して、いくつかのデータをレンダリングしています。
const CATEGORIES = [
{
id: 1, title: "LABEL C:1", data: [
{ id: 11, name: "LABEL C:1 S:11" },
{ id: 12, name: "LABEL C:1 S:12" },
{ id: 13, name: "LABEL C:1 S:13" },
// ... more items
]
},
// ... more items
];
次に、すべてを処理するコンポーネントは次のとおりです。
//
// const CATEGORIES = [ ... ];
class CategoriesAndSubcategories extends React.Component{
keyExtractor = (item, idx) => {
console.log("key extractor", JSON.stringify(item));
return item.id;
};
renderItem = (props) => {
return <Text>{props.item.name}</Text>;
}
renderSectionHeader = (props) => {
return <Text>{props.section.title}</Text>;
}
render = () => {
console.log("STARTED RENDER");
const CATEGORIES = this.props.categories;
return <View style={{ flex: 1, backgroundColor: "#FFF" }}>
<SectionList
style={{ flex: 1 }}
contentContainerStyle={{ flexGrow:1 }}
sections={CATEGORIES}
keyExtractor={this.keyExtractor}
renderItem={this.renderItem}
renderSectionHeader={this.renderSectionHeader}
/>
</View>
};
};
私が気付いたことは、1console.log
回のレンダリングで同じアイテムに対して s が複数回取得されることです。keyExtractor メソッドに console.log を配置しましたが、どのレンダリング方法 (renderItem
またはrenderSectionHeader
) を使用しても同じ状況を再現できます。
クラス (CategoriesAndSubcategories) コンポーネントのレンダリング メソッドは、レンダリング メソッドの先頭にある console.log で証明されているように、1 回だけトリガーされます。
ただし、コンソールで取得しているログを見てください。
STARTED RENDER
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
key extractor {"id":12,"name":"LABEL C:2 S:12"}
key extractor {"id":13,"name":"LABEL C:2 S:13"}
key extractor {"id":14,"name":"LABEL C:3 S:14"}
key extractor {"id":15,"name":"LABEL C:3 S:15"}
key extractor {"id":16,"name":"LABEL C:3 S:16"}
key extractor {"id":17,"name":"LABEL C:3 S:17"}
key extractor {"id":18,"name":"LABEL C:3 S:18"}
key extractor {"id":19,"name":"LABEL C:3 S:19"}
key extractor {"id":20,"name":"LABEL C:3 S:20"}
key extractor {"id":21,"name":"LABEL C:3 S:21"}
key extractor {"id":22,"name":"LABEL C:3 S:22"}
key extractor {"id":23,"name":"LABEL C:3 S:23"}
key extractor {"id":24,"name":"LABEL C:3 S:24"}
key extractor {"id":25,"name":"LABEL C:3 S:25"}
key extractor {"id":26,"name":"LABEL C:3 S:26"}
key extractor {"id":27,"name":"LABEL C:3 S:27"}
key extractor {"id":28,"name":"LABEL C:3 S:28"}
key extractor {"id":29,"name":"LABEL C:3 S:29"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":31,"name":"LABEL C:3 S:31"}
key extractor {"id":32,"name":"LABEL C:3 S:32"}
key extractor {"id":33,"name":"LABEL C:3 S:33"}
key extractor {"id":34,"name":"LABEL C:3 S:34"}
key extractor {"id":35,"name":"LABEL C:3 S:35"}
key extractor {"id":36,"name":"LABEL C:3 S:36"}
key extractor {"id":37,"name":"LABEL C:3 S:37"}
key extractor {"id":38,"name":"LABEL C:3 S:38"}
key extractor {"id":39,"name":"LABEL C:3 S:39"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":41,"name":"LABEL C:3 S:41"}
key extractor {"id":42,"name":"LABEL C:3 S:42"}
key extractor {"id":43,"name":"LABEL C:3 S:43"}
key extractor {"id":44,"name":"LABEL C:3 S:44"}
key extractor {"id":45,"name":"LABEL C:3 S:45"}
key extractor {"id":46,"name":"LABEL C:3 S:46"}
key extractor {"id":47,"name":"LABEL C:3 S:47"}
key extractor {"id":48,"name":"LABEL C:3 S:48"}
key extractor {"id":49,"name":"LABEL C:3 S:49"}
key extractor {"id":50,"name":"LABEL C:3 S:50"}
key extractor {"id":51,"name":"LABEL C:3 S:51"}
key extractor {"id":52,"name":"LABEL C:3 S:52"}
key extractor {"id":53,"name":"LABEL C:3 S:53"}
key extractor {"id":54,"name":"LABEL C:3 S:54"}
key extractor {"id":55,"name":"LABEL C:3 S:55"}
key extractor {"id":57,"name":"LABEL C:3 S:57"}
key extractor {"id":58,"name":"LABEL C:3 S:58"}
key extractor {"id":59,"name":"LABEL C:3 S:59"}
key extractor {"id":60,"name":"LABEL C:3 S:60"}
key extractor {"id":61,"name":"LABEL C:3 S:61"}
key extractor {"id":62,"name":"LABEL C:3 S:62"}
key extractor {"id":63,"name":"LABEL C:3 S:63"}
key extractor {"id":64,"name":"LABEL C:3 S:64"}
key extractor {"id":65,"name":"LABEL C:3 S:65"}
key extractor {"id":66,"name":"LABEL C:3 S:66"}
key extractor {"id":67,"name":"LABEL C:4 S:67"}
key extractor {"id":68,"name":"LABEL C:4 S:68"}
key extractor {"id":69,"name":"LABEL C:4 S:69"}
key extractor {"id":70,"name":"LABEL C:4 S:70"}
key extractor {"id":71,"name":"LABEL C:4 S:71"}
key extractor {"id":72,"name":"LABEL C:4 S:72"}
key extractor {"id":88,"name":"LABEL C:4 S:88"}
key extractor {"id":73,"name":"LABEL C:5 S:73"}
key extractor {"id":74,"name":"LABEL C:5 S:74"}
key extractor {"id":75,"name":"LABEL C:5 S:75"}
key extractor {"id":76,"name":"LABEL C:5 S:76"}
key extractor {"id":77,"name":"LABEL C:6 S:77"}
key extractor {"id":78,"name":"LABEL C:6 S:78"}
key extractor {"id":79,"name":"LABEL C:6 S:79"}
key extractor {"id":80,"name":"LABEL C:6 S:80"}
key extractor {"id":81,"name":"LABEL C:6 S:81"}
key extractor {"id":82,"name":"LABEL C:6 S:82"}
key extractor {"id":83,"name":"LABEL C:6 S:83"}
key extractor {"id":84,"name":"LABEL C:6 S:84"}
key extractor {"id":85,"name":"LABEL C:6 S:85"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
key extractor {"id":12,"name":"LABEL C:2 S:12"}
key extractor {"id":13,"name":"LABEL C:2 S:13"}
key extractor {"id":14,"name":"LABEL C:3 S:14"}
key extractor {"id":15,"name":"LABEL C:3 S:15"}
key extractor {"id":16,"name":"LABEL C:3 S:16"}
key extractor {"id":17,"name":"LABEL C:3 S:17"}
key extractor {"id":18,"name":"LABEL C:3 S:18"}
key extractor {"id":19,"name":"LABEL C:3 S:19"}
key extractor {"id":20,"name":"LABEL C:3 S:20"}
key extractor {"id":21,"name":"LABEL C:3 S:21"}
key extractor {"id":22,"name":"LABEL C:3 S:22"}
key extractor {"id":23,"name":"LABEL C:3 S:23"}
key extractor {"id":24,"name":"LABEL C:3 S:24"}
key extractor {"id":25,"name":"LABEL C:3 S:25"}
key extractor {"id":26,"name":"LABEL C:3 S:26"}
key extractor {"id":27,"name":"LABEL C:3 S:27"}
key extractor {"id":28,"name":"LABEL C:3 S:28"}
key extractor {"id":29,"name":"LABEL C:3 S:29"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":12,"name":"LABEL C:2 S:12"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
key extractor {"id":13,"name":"LABEL C:2 S:13"}
key extractor {"id":12,"name":"LABEL C:2 S:12"}
key extractor {"id":14,"name":"LABEL C:3 S:14"}
key extractor {"id":15,"name":"LABEL C:3 S:15"}
key extractor {"id":14,"name":"LABEL C:3 S:14"}
key extractor {"id":16,"name":"LABEL C:3 S:16"}
key extractor {"id":15,"name":"LABEL C:3 S:15"}
key extractor {"id":17,"name":"LABEL C:3 S:17"}
key extractor {"id":16,"name":"LABEL C:3 S:16"}
key extractor {"id":18,"name":"LABEL C:3 S:18"}
key extractor {"id":17,"name":"LABEL C:3 S:17"}
key extractor {"id":19,"name":"LABEL C:3 S:19"}
key extractor {"id":18,"name":"LABEL C:3 S:18"}
key extractor {"id":20,"name":"LABEL C:3 S:20"}
key extractor {"id":19,"name":"LABEL C:3 S:19"}
key extractor {"id":21,"name":"LABEL C:3 S:21"}
key extractor {"id":20,"name":"LABEL C:3 S:20"}
key extractor {"id":22,"name":"LABEL C:3 S:22"}
key extractor {"id":21,"name":"LABEL C:3 S:21"}
key extractor {"id":23,"name":"LABEL C:3 S:23"}
key extractor {"id":22,"name":"LABEL C:3 S:22"}
key extractor {"id":24,"name":"LABEL C:3 S:24"}
key extractor {"id":23,"name":"LABEL C:3 S:23"}
key extractor {"id":25,"name":"LABEL C:3 S:25"}
key extractor {"id":24,"name":"LABEL C:3 S:24"}
key extractor {"id":26,"name":"LABEL C:3 S:26"}
key extractor {"id":25,"name":"LABEL C:3 S:25"}
key extractor {"id":27,"name":"LABEL C:3 S:27"}
key extractor {"id":26,"name":"LABEL C:3 S:26"}
key extractor {"id":28,"name":"LABEL C:3 S:28"}
key extractor {"id":27,"name":"LABEL C:3 S:27"}
key extractor {"id":29,"name":"LABEL C:3 S:29"}
key extractor {"id":28,"name":"LABEL C:3 S:28"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":29,"name":"LABEL C:3 S:29"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
key extractor {"id":12,"name":"LABEL C:2 S:12"}
key extractor {"id":13,"name":"LABEL C:2 S:13"}
key extractor {"id":14,"name":"LABEL C:3 S:14"}
key extractor {"id":15,"name":"LABEL C:3 S:15"}
key extractor {"id":16,"name":"LABEL C:3 S:16"}
key extractor {"id":17,"name":"LABEL C:3 S:17"}
key extractor {"id":18,"name":"LABEL C:3 S:18"}
key extractor {"id":19,"name":"LABEL C:3 S:19"}
key extractor {"id":20,"name":"LABEL C:3 S:20"}
key extractor {"id":21,"name":"LABEL C:3 S:21"}
key extractor {"id":22,"name":"LABEL C:3 S:22"}
key extractor {"id":23,"name":"LABEL C:3 S:23"}
key extractor {"id":24,"name":"LABEL C:3 S:24"}
key extractor {"id":25,"name":"LABEL C:3 S:25"}
key extractor {"id":26,"name":"LABEL C:3 S:26"}
key extractor {"id":27,"name":"LABEL C:3 S:27"}
key extractor {"id":28,"name":"LABEL C:3 S:28"}
key extractor {"id":29,"name":"LABEL C:3 S:29"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":31,"name":"LABEL C:3 S:31"}
key extractor {"id":32,"name":"LABEL C:3 S:32"}
key extractor {"id":33,"name":"LABEL C:3 S:33"}
key extractor {"id":34,"name":"LABEL C:3 S:34"}
key extractor {"id":35,"name":"LABEL C:3 S:35"}
key extractor {"id":36,"name":"LABEL C:3 S:36"}
key extractor {"id":37,"name":"LABEL C:3 S:37"}
key extractor {"id":38,"name":"LABEL C:3 S:38"}
key extractor {"id":39,"name":"LABEL C:3 S:39"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":41,"name":"LABEL C:3 S:41"}
key extractor {"id":42,"name":"LABEL C:3 S:42"}
key extractor {"id":43,"name":"LABEL C:3 S:43"}
key extractor {"id":44,"name":"LABEL C:3 S:44"}
key extractor {"id":45,"name":"LABEL C:3 S:45"}
key extractor {"id":46,"name":"LABEL C:3 S:46"}
key extractor {"id":47,"name":"LABEL C:3 S:47"}
key extractor {"id":48,"name":"LABEL C:3 S:48"}
key extractor {"id":49,"name":"LABEL C:3 S:49"}
key extractor {"id":50,"name":"LABEL C:3 S:50"}
key extractor {"id":51,"name":"LABEL C:3 S:51"}
key extractor {"id":52,"name":"LABEL C:3 S:52"}
key extractor {"id":53,"name":"LABEL C:3 S:53"}
key extractor {"id":54,"name":"LABEL C:3 S:54"}
key extractor {"id":55,"name":"LABEL C:3 S:55"}
key extractor {"id":57,"name":"LABEL C:3 S:57"}
key extractor {"id":58,"name":"LABEL C:3 S:58"}
key extractor {"id":59,"name":"LABEL C:3 S:59"}
key extractor {"id":60,"name":"LABEL C:3 S:60"}
key extractor {"id":61,"name":"LABEL C:3 S:61"}
key extractor {"id":62,"name":"LABEL C:3 S:62"}
key extractor {"id":63,"name":"LABEL C:3 S:63"}
key extractor {"id":64,"name":"LABEL C:3 S:64"}
key extractor {"id":65,"name":"LABEL C:3 S:65"}
key extractor {"id":66,"name":"LABEL C:3 S:66"}
key extractor {"id":67,"name":"LABEL C:4 S:67"}
key extractor {"id":68,"name":"LABEL C:4 S:68"}
key extractor {"id":69,"name":"LABEL C:4 S:69"}
key extractor {"id":70,"name":"LABEL C:4 S:70"}
key extractor {"id":71,"name":"LABEL C:4 S:71"}
key extractor {"id":72,"name":"LABEL C:4 S:72"}
key extractor {"id":88,"name":"LABEL C:4 S:88"}
key extractor {"id":73,"name":"LABEL C:5 S:73"}
key extractor {"id":74,"name":"LABEL C:5 S:74"}
key extractor {"id":75,"name":"LABEL C:5 S:75"}
key extractor {"id":76,"name":"LABEL C:5 S:76"}
key extractor {"id":77,"name":"LABEL C:6 S:77"}
key extractor {"id":78,"name":"LABEL C:6 S:78"}
key extractor {"id":79,"name":"LABEL C:6 S:79"}
key extractor {"id":80,"name":"LABEL C:6 S:80"}
key extractor {"id":81,"name":"LABEL C:6 S:81"}
key extractor {"id":82,"name":"LABEL C:6 S:82"}
key extractor {"id":83,"name":"LABEL C:6 S:83"}
key extractor {"id":84,"name":"LABEL C:6 S:84"}
key extractor {"id":85,"name":"LABEL C:6 S:85"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
key extractor {"id":12,"name":"LABEL C:2 S:12"}
key extractor {"id":13,"name":"LABEL C:2 S:13"}
key extractor {"id":14,"name":"LABEL C:3 S:14"}
key extractor {"id":15,"name":"LABEL C:3 S:15"}
key extractor {"id":16,"name":"LABEL C:3 S:16"}
key extractor {"id":17,"name":"LABEL C:3 S:17"}
key extractor {"id":18,"name":"LABEL C:3 S:18"}
key extractor {"id":19,"name":"LABEL C:3 S:19"}
key extractor {"id":20,"name":"LABEL C:3 S:20"}
key extractor {"id":21,"name":"LABEL C:3 S:21"}
key extractor {"id":22,"name":"LABEL C:3 S:22"}
key extractor {"id":23,"name":"LABEL C:3 S:23"}
key extractor {"id":24,"name":"LABEL C:3 S:24"}
key extractor {"id":25,"name":"LABEL C:3 S:25"}
key extractor {"id":26,"name":"LABEL C:3 S:26"}
key extractor {"id":27,"name":"LABEL C:3 S:27"}
key extractor {"id":28,"name":"LABEL C:3 S:28"}
key extractor {"id":29,"name":"LABEL C:3 S:29"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":31,"name":"LABEL C:3 S:31"}
key extractor {"id":32,"name":"LABEL C:3 S:32"}
key extractor {"id":33,"name":"LABEL C:3 S:33"}
key extractor {"id":34,"name":"LABEL C:3 S:34"}
key extractor {"id":35,"name":"LABEL C:3 S:35"}
key extractor {"id":36,"name":"LABEL C:3 S:36"}
key extractor {"id":37,"name":"LABEL C:3 S:37"}
key extractor {"id":38,"name":"LABEL C:3 S:38"}
key extractor {"id":39,"name":"LABEL C:3 S:39"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":12,"name":"LABEL C:2 S:12"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
key extractor {"id":13,"name":"LABEL C:2 S:13"}
key extractor {"id":12,"name":"LABEL C:2 S:12"}
key extractor {"id":14,"name":"LABEL C:3 S:14"}
key extractor {"id":15,"name":"LABEL C:3 S:15"}
key extractor {"id":14,"name":"LABEL C:3 S:14"}
key extractor {"id":16,"name":"LABEL C:3 S:16"}
key extractor {"id":15,"name":"LABEL C:3 S:15"}
key extractor {"id":17,"name":"LABEL C:3 S:17"}
key extractor {"id":16,"name":"LABEL C:3 S:16"}
key extractor {"id":18,"name":"LABEL C:3 S:18"}
key extractor {"id":17,"name":"LABEL C:3 S:17"}
key extractor {"id":19,"name":"LABEL C:3 S:19"}
key extractor {"id":18,"name":"LABEL C:3 S:18"}
key extractor {"id":20,"name":"LABEL C:3 S:20"}
key extractor {"id":19,"name":"LABEL C:3 S:19"}
key extractor {"id":21,"name":"LABEL C:3 S:21"}
key extractor {"id":20,"name":"LABEL C:3 S:20"}
key extractor {"id":22,"name":"LABEL C:3 S:22"}
key extractor {"id":21,"name":"LABEL C:3 S:21"}
key extractor {"id":23,"name":"LABEL C:3 S:23"}
key extractor {"id":22,"name":"LABEL C:3 S:22"}
key extractor {"id":24,"name":"LABEL C:3 S:24"}
key extractor {"id":23,"name":"LABEL C:3 S:23"}
key extractor {"id":25,"name":"LABEL C:3 S:25"}
key extractor {"id":24,"name":"LABEL C:3 S:24"}
key extractor {"id":26,"name":"LABEL C:3 S:26"}
key extractor {"id":25,"name":"LABEL C:3 S:25"}
key extractor {"id":27,"name":"LABEL C:3 S:27"}
key extractor {"id":26,"name":"LABEL C:3 S:26"}
key extractor {"id":28,"name":"LABEL C:3 S:28"}
key extractor {"id":27,"name":"LABEL C:3 S:27"}
key extractor {"id":29,"name":"LABEL C:3 S:29"}
key extractor {"id":28,"name":"LABEL C:3 S:28"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":29,"name":"LABEL C:3 S:29"}
key extractor {"id":31,"name":"LABEL C:3 S:31"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":32,"name":"LABEL C:3 S:32"}
key extractor {"id":31,"name":"LABEL C:3 S:31"}
key extractor {"id":33,"name":"LABEL C:3 S:33"}
key extractor {"id":32,"name":"LABEL C:3 S:32"}
key extractor {"id":34,"name":"LABEL C:3 S:34"}
key extractor {"id":33,"name":"LABEL C:3 S:33"}
key extractor {"id":35,"name":"LABEL C:3 S:35"}
key extractor {"id":34,"name":"LABEL C:3 S:34"}
key extractor {"id":36,"name":"LABEL C:3 S:36"}
key extractor {"id":35,"name":"LABEL C:3 S:35"}
key extractor {"id":37,"name":"LABEL C:3 S:37"}
key extractor {"id":36,"name":"LABEL C:3 S:36"}
key extractor {"id":38,"name":"LABEL C:3 S:38"}
key extractor {"id":37,"name":"LABEL C:3 S:37"}
key extractor {"id":39,"name":"LABEL C:3 S:39"}
key extractor {"id":38,"name":"LABEL C:3 S:38"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":39,"name":"LABEL C:3 S:39"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
key extractor {"id":12,"name":"LABEL C:2 S:12"}
key extractor {"id":13,"name":"LABEL C:2 S:13"}
key extractor {"id":14,"name":"LABEL C:3 S:14"}
key extractor {"id":15,"name":"LABEL C:3 S:15"}
key extractor {"id":16,"name":"LABEL C:3 S:16"}
key extractor {"id":17,"name":"LABEL C:3 S:17"}
key extractor {"id":18,"name":"LABEL C:3 S:18"}
key extractor {"id":19,"name":"LABEL C:3 S:19"}
key extractor {"id":20,"name":"LABEL C:3 S:20"}
key extractor {"id":21,"name":"LABEL C:3 S:21"}
key extractor {"id":22,"name":"LABEL C:3 S:22"}
key extractor {"id":23,"name":"LABEL C:3 S:23"}
key extractor {"id":24,"name":"LABEL C:3 S:24"}
key extractor {"id":25,"name":"LABEL C:3 S:25"}
key extractor {"id":26,"name":"LABEL C:3 S:26"}
key extractor {"id":27,"name":"LABEL C:3 S:27"}
key extractor {"id":28,"name":"LABEL C:3 S:28"}
key extractor {"id":29,"name":"LABEL C:3 S:29"}
key extractor {"id":30,"name":"LABEL C:3 S:30"}
key extractor {"id":31,"name":"LABEL C:3 S:31"}
key extractor {"id":32,"name":"LABEL C:3 S:32"}
key extractor {"id":33,"name":"LABEL C:3 S:33"}
key extractor {"id":34,"name":"LABEL C:3 S:34"}
key extractor {"id":35,"name":"LABEL C:3 S:35"}
key extractor {"id":36,"name":"LABEL C:3 S:36"}
key extractor {"id":37,"name":"LABEL C:3 S:37"}
key extractor {"id":38,"name":"LABEL C:3 S:38"}
key extractor {"id":39,"name":"LABEL C:3 S:39"}
key extractor {"id":40,"name":"LABEL C:3 S:40"}
key extractor {"id":41,"name":"LABEL C:3 S:41"}
key extractor {"id":42,"name":"LABEL C:3 S:42"}
key extractor {"id":43,"name":"LABEL C:3 S:43"}
key extractor {"id":44,"name":"LABEL C:3 S:44"}
key extractor {"id":45,"name":"LABEL C:3 S:45"}
key extractor {"id":46,"name":"LABEL C:3 S:46"}
key extractor {"id":47,"name":"LABEL C:3 S:47"}
key extractor {"id":48,"name":"LABEL C:3 S:48"}
key extractor {"id":49,"name":"LABEL C:3 S:49"}
key extractor {"id":50,"name":"LABEL C:3 S:50"}
key extractor {"id":51,"name":"LABEL C:3 S:51"}
key extractor {"id":52,"name":"LABEL C:3 S:52"}
key extractor {"id":53,"name":"LABEL C:3 S:53"}
key extractor {"id":54,"name":"LABEL C:3 S:54"}
key extractor {"id":55,"name":"LABEL C:3 S:55"}
key extractor {"id":57,"name":"LABEL C:3 S:57"}
key extractor {"id":58,"name":"LABEL C:3 S:58"}
key extractor {"id":59,"name":"LABEL C:3 S:59"}
key extractor {"id":60,"name":"LABEL C:3 S:60"}
key extractor {"id":61,"name":"LABEL C:3 S:61"}
key extractor {"id":62,"name":"LABEL C:3 S:62"}
key extractor {"id":63,"name":"LABEL C:3 S:63"}
key extractor {"id":64,"name":"LABEL C:3 S:64"}
key extractor {"id":65,"name":"LABEL C:3 S:65"}
key extractor {"id":66,"name":"LABEL C:3 S:66"}
key extractor {"id":67,"name":"LABEL C:4 S:67"}
key extractor {"id":68,"name":"LABEL C:4 S:68"}
key extractor {"id":69,"name":"LABEL C:4 S:69"}
key extractor {"id":70,"name":"LABEL C:4 S:70"}
key extractor {"id":71,"name":"LABEL C:4 S:71"}
key extractor {"id":72,"name":"LABEL C:4 S:72"}
key extractor {"id":88,"name":"LABEL C:4 S:88"}
key extractor {"id":73,"name":"LABEL C:5 S:73"}
key extractor {"id":74,"name":"LABEL C:5 S:74"}
key extractor {"id":75,"name":"LABEL C:5 S:75"}
key extractor {"id":76,"name":"LABEL C:5 S:76"}
key extractor {"id":77,"name":"LABEL C:6 S:77"}
key extractor {"id":78,"name":"LABEL C:6 S:78"}
key extractor {"id":79,"name":"LABEL C:6 S:79"}
key extractor {"id":80,"name":"LABEL C:6 S:80"}
key extractor {"id":81,"name":"LABEL C:6 S:81"}
key extractor {"id":82,"name":"LABEL C:6 S:82"}
key extractor {"id":83,"name":"LABEL C:6 S:83"}
key extractor {"id":84,"name":"LABEL C:6 S:84"}
key extractor {"id":85,"name":"LABEL C:6 S:85"}
key extractor {"id":1,"name":"LABEL C:1 S:1"}
key extractor {"id":2,"name":"LABEL C:1 S:2"}
key extractor {"id":3,"name":"LABEL C:1 S:3"}
key extractor {"id":4,"name":"LABEL C:1 S:4"}
key extractor {"id":5,"name":"LABEL C:1 S:5"}
key extractor {"id":6,"name":"LABEL C:1 S:6"}
key extractor {"id":7,"name":"LABEL C:1 S:7"}
key extractor {"id":8,"name":"LABEL C:1 S:8"}
key extractor {"id":9,"name":"LABEL C:1 S:9"}
key extractor {"id":10,"name":"LABEL C:2 S:10"}
key extractor {"id":11,"name":"LABEL C:2 S:11"}
... due to StackOverflow's character limit per-post, I cannot post the full log
... however, the same 'key extractor' logs continue about 5 times more than what posted here
私はあなたなどをからかおうとしているわけではありません。これらは、このコンポーネントの最初で唯一のレンダリングで取得した正確なログです。SectionList の各項目は、SectionList のレンダリングが停止する前に 10 回以上再レンダリングされます。配列内のデータが更新されないレンダリングCATEGORIES
中、外側のコンテナでレイアウトの変更は発生せず、SectionList の UI でスクロールも発生しません。また、ログで確認できるように、アイテムは「ランダムに」再レンダリングされているようです。アイテムはkey extractor {"id":40,"name":"LABEL C:3 S:40"}
38 回連続して表示されます (ログ リストの約 70%)。途中で、最初からやり直します。
このコードで非常に多くの再レンダリングが発生する理由を知っている人はいますか? 私は何か間違ったことをしていますか?
ps Expo SDK36、React 16.9、React Native 0.61.4、React Navigation 5 (現時点では 5.0.5) を使用しています。動作は、iOS (10+) と Android (9) で同じです。