Реакция передачи реквизита от родительского обертки к ребенку

Question

Мне нужно передать реквизиты из оболочки в дочерний компонент

Имеют такую ​​структуру:

CabinetBlockContainer.jsx

smallChild .jsx

Сейчас мой smallChild.jsx выглядит так:

return (
    <CabinetBlockContainer>
      <div className={props.className}>
        <Typography variant="h6" color="primary">
          {props.title}
        </Typography>
        <Typography variant="caption">{props.subtitle}</Typography>
      </div>
      <BalanceSmallBlock balance="1254.51" needIcon={props.needIcon} />
    </CabinetBlockContainer>
  );

, а мой контейнер выглядит так:

 return (
    <div className={props.className}>
      <div className="block-wrapper" >

      </div>
    </div>
  );
})

У меня есть много стилей для моих блоков, поэтому я создал обертку ( CabinetBlockContainer ). Мне нужно передать реквизиты из моего CabinetBlockContainer его дочернему компоненту. Я действительно не знаю, является ли это лучшей практикой, но кажется нормальным.

Я пытался найти в документации, как передавать реквизиты, как это, но есть какое-то решение.

Answer 1

Используйте {props.children} внутри вашей обертки, кажется, вы хотите сделать что-то вроде this .

Answer 2

Вы можете передать реквизиты детям, клонируя их с новыми реквизитами

, чтобы лучше понять, как работают реквизиты и состояния, см. this

, и вот пример ранее того же вопроса на SO