javascript - 如何在 React Native 中使用 sectionList 显示数据？

Question

我想在 React Native 中使用列表部分显示数据。我正在使用 reduce() 提取数据，但我无法理解为什么我会收到未定义的行为，说请提供 html 或 uri 作为 react native render html 的 Prop 。

我想将 sectionList 项显示为 HTML 内容，SectionList 的标题是 specificationsData 中的标题。

const specificationsData = specifications.reduce( (acc, curValue) => {

            if (curValue.title !== undefined && curValue.description !== undefined){

                let newObj = {};

                newObj['data'] = curValue.description;

                newObj['title'] = curValue.title;

                console.log(curValue.title)

                acc.push(newObj);

                return acc;
            }

        }, []);

        console.log(specificationsData)

以上日志的结果:

现在我将以上数据传递到SectionList:

import HTMLView from 'react-native-render-html';

<SectionList
                    renderItem={({item, index, section}) => <HTMLView key={index} value={item}/>}
                    renderSectionHeader={({section: {title}}) => (
                        <Text style={{fontWeight: 'bold', color: 'red'}}>{title}</Text>
                    )}
                    sections={specificationsData}
                    keyExtractor={(item, index) => item + index}
                />

如何通过传递 specificationsData 来传递 sectionList 的显示数据和标题？

请看上面代码的截图:

Answer 1

根据SectionList documentation ，数据需要是您的 specificationsData 中的一个数组。更新以下行:

newObj['data'] = [curValue.description];