В настоящее время у меня есть набор компонентов, которые я собираю для отображения карты (ближайший пример выглядит следующим образом: https://n43z9w3o0.codesandbox.io/).
Вместо изображения в в правом верхнем углу, однако, будет флажок. У меня есть 3 компонента, которые я использую для этого:
card.tsx, который является функциональным компонентом, который отображает имена и описания для каждой карты. toolbar.tsx, который является компонентом класса, который позволяет пользователю взаимодействовать с карточками (удалять карточки, устанавливать все флажки и т. Д. c.) Через верхнюю панель инструментов. cardview.tsx который является компонентом класса, который, по моему мнению, должен иметь все функции, позволяющие действиям панели инструментов изменять состояние представления карты (снова: удаление, флажки)
Как я могу это сделать это? Например, мне нужно выбрать все флажки в функции selectAll, но эта функция находится в файле toolbar. Компонент checkbox находится в файле card, и этот компонент ищет isChecked prop. Но значение этого реквизита обновляется в компоненте toolbar, поэтому я не могу просто указать значение реквизита из toolbar. Как бы я получить правильное значение?
Я запутался в том, что было бы лучшим способом go об этом ... refs? контекст? Любое руководство будет очень цениться. Спасибо!