我想使用在组件 1 中搜索到的数据(这是一个允许您搜索食谱的页面,然后它会给出一个带有名称成分和说明的食谱)并在第 2 页中使用它(将允许您查看食谱然后在商店 API 中搜索成分)
App.js
class App extends Component {
render() {
return(
<Router>
<div>
<Route exact path = '/' component = {Search}/>
<Route exact path = '/shopping/' component = {Store}/>
</div>
</Router>
)
}
}
export default App;
Class Component 1
class Search extends Component {
state = {
drinks: [],
userInput: "",
selectedDrink: null,
recipeName: "",
recipeInstructions: "",
recipeIngredients: ""
};
Class component 2
class Store extends Component {
state = {
recipe: []
};