对象内的javascript对象

Question

我正在研究反应并使用 ant 设计列表组件，使其成为无状态子组件，以便在任何地方使用它。我的数据源（在本例中为 props.datasource）是对象数组。列表组件遍历每个对象。

关于列表组件的标题和描述，我想传递我无法做到的道具。现在它是 title = {item.line1} 和 description = {item.city}，这里“line1”和“city”是预定义的，但我想使用道具。我想从父组件传递 title="line1" ，然后在列表组件标题字段中将其用作 {props.title} 。

<List

dataSource={props.dataSource}

renderItem={(item) => (

<List.Item

  key={item.id}

>

  <List.Item.Meta

    avatar={

      <Avatar

        icon={<CheckOutlined />} //anything 

      />

    }

    title={item.line1}

    description={item.city}

  />

</List.Item>

)}

/>

尽我所能，我无法做到这一点，如何在对象内添加对象？

谢谢

Answer 1

我在某处阅读以通过以下方式访问对象的属性：表达式 [表达式]通过写 title={item[&nbsp;${props.title}]} 问题就解决了。谢谢

Answer 2

如果我理解正确，您需要的是解构子组件的道具，它可以这样实现：<List&nbsp; dataSource={props.dataSource}&nbsp; renderItem={(item) => (&nbsp; &nbsp; <List.Item&nbsp; &nbsp; &nbsp; key={item.id}&nbsp; &nbsp; >&nbsp; &nbsp; &nbsp; <List.Item.Meta&nbsp; &nbsp; &nbsp; &nbsp; avatar={&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Avatar&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; icon={<CheckOutlined />} //anything&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; />&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; {...item} // Like this&nbsp; &nbsp; &nbsp; />&nbsp; &nbsp; </List.Item>&nbsp; )}/>