Question

在React应用程序中，我需要为数组中的所有元素生成HTML代码并渲染它们。

说明：

提供商：API提供的数据

PluginsProviderData ：由其他组件生成的HTML元素

moduleData ：返回5个对象。我需要生成＆＃34; PluginsProviderData＆＃34;每个对象的元素。

_getConfigurationList() {
    const { providers } = this.props;
    let providersConfigurationList = [];
    if (providers != undefined) {
        let moduleData = providers[3].modules;
        providersConfigurationList = moduleData.forEach(function(data) {
            return (
                <PluginsProviderData key={data._id} title={data.name} headerId={"header" + data._id} manageId={"manage" + data._id}>                        
                </PluginsProviderData>
            );
        });
    }
    return providersConfigurationList;
    console.log(providersConfigurationList);
}

render() {

    const { providers } = this.props;

    let configurationList = this._getConfigurationList();

    return (
        <div>
            <div class="row topSpace">
                <div class="small-12 columns highLimiter">
                     {configurationList}
                </div>
            </div>
       </div>
    );
}

有人能告诉我如何处理这样的任务吗？我试图创建一个包含moduleData.forEach部分的变量，然后将它推送到providersConfigurationList数组，但数组始终为空。我不确定我做了什么错误。

提前致谢！

Answer 1

moduleData.map代替moduleData.forEach？

如何将生成的元素推入数组并在React中呈现它们

1 个答案: