javascript объект внутри объекта

Question

Я работаю над реакцией и использую компонент списка разработки муравья, сделал его дочерним компонентом без сохранения состояния, чтобы использовать его везде. мой источник данных (в данном случае 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

Я где-то читал, чтобы получить доступ к свойству объектов с помощью: expression [expression]

и путем записи 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>
  )}
/>