对象内的javascript对象

Question

我正在研究反应并使用 ant 设计列表组件，使其成为无状态子组件，以便在任何地方使用它。我的数据源（在本例中为 props.datasource）是对象数组。列表组件遍历每个对象。关于列表组件的标题和描述，我想传递我无法做到的道具。现在它是 title = {item.line1} 和 description = {item.city}，这里“line1”和“city”是预定义的，但我想使用道具。我想从父组件传递 title="line1" ，然后在列表组件标题字段中将其用作 {props.title} 。<ListdataSource={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[ ${props.title}]} 问题就解决了。

谢谢

Answer 2

如果我理解正确，您需要的是解构子组件的道具，它可以这样实现：

<List

  dataSource={props.dataSource}

  renderItem={(item) => (

    <List.Item

      key={item.id}

    >

      <List.Item.Meta

        avatar={

          <Avatar

            icon={<CheckOutlined />} //anything 

          />

        }

        {...item} // Like this

      />

    </List.Item>

  )}

/>