React 无法从 api 渲染元素数组

Question

当我尝试映射这个时：

 //api [{"id":1,"label":"Testing","items":[{"id":1,"value":"Learn React","flag":2},{"id":2,"value":"Learn .net","flag":2}]},{"id":2,"label":"Testing","items":[{"id":1,"value":"Learn React","flag":2},{"id":2,"value":"Learn .net","flag":2}]}]

 renderLists() {
        const lists =this.props.data.map((item, index) => <Holder data={item} key={index} />);
        console.log(this.props.data);
        return (
            { lists }
        ); 
    }

函数我得到一个错误：

对象作为 React 子对象无效（找到：带有键 {lists} 的对象）。如果您打算渲染一组子项，请改用数组。

Answer 1

你试过包装吗？例如：

const lists = this.props.data.map((item, index) => <Holder data={item} key={index} />);
console.log(this.props.data);
return (
    <React.Fragment>
      { lists }
    </React.Fragment>
);