时间戳

首页 > 解决方案 > 如何在循环中加载组件，将对象的属性作为道具传递？

reactjs - 如何在循环中加载组件，将对象的属性作为道具传递？

问题描述

我想循环渲染这个组件：

<OptionsFly title={prop} text={prop}></OptionsFly>

根据此数组具有的对象数量：

   let options = [{
        title: "Regala ",
        text: "Sorprende ",
    }, {
        title: "Marc",
        text: " sorpresa",
    }];

也就是我要加载组件两次，并将对应的属性作为props传递

标签： reactjs

解决方案

您可以使用map函数对数组的每个元素执行操作。

     <>
        {options.map((el, i) => 
           <OptionsFly key={`${el.title}_${i}`} title={el.title} text={el.text} />
        )}
     </>

推荐阅读