Reactjs: Как отправить полученные данные API из компонента в компонент маршрута c Dynami?

Question

Привет всем, у меня есть этот проект, веб-приложение с рецептами, чтобы я научился лучше реагировать

this is the homepage component where i get the data from the API

Recipes Component: the data from the useState is looped through and passed to the Recipes components

Now i wanted create a component where when a user clicks on the content it redirect him/her to a new page

компонент рецепта

. Проблема в том, что я не знаю, как передавать данные из компонента Recipes в Recipe и выводить их в область, отмеченную красным пером. Как сделать это без получения другого API (он ограничен) и без использования redux. Нужна помощь

Answer 1

В файле Recipes. js вы можете передать состояние компоненту Link.

<Link to={
  pathname: `/recipe/${props.title}`
  state={
    ingredients: props.ingredients
  }
} />

В файле Recipe. js это свойство ингредиентов будет доступно в props.location. state.ingredients.

Answer 2

Если вы используете маршрутизатор, вы можете пропустить через него опору. В противном случае магазин с useReducer может быть отличным решением.