javascript - 组件如何将值传递给上一页组件

我有两个组件，FormComponent和OrderListComponent。 FormComponent上有一个字段，要求用户从OrderListComponent的列表中选择一个值。因此，我在FormComponent的字段上放置了一个按钮，当用户单击该按钮时，我使用router.push('XXXX')将该页面导航到OrderListComponent以显示用户的所有选项。当用户单击OrderListComponent上的选项之一时，我使用router.goBack()返回到FormComponent。问题是，FormComponent如何从OrderListComponent获取选定的值？我知道我可以将选择另存为州的状态，但是我在徘徊是否有解决此问题的更直接方法。

最佳答案

为此，将选择的值存储在redux存储或组件状态本身中将是更好的选择，但是您也可以


将其存储在localStorage中
将其存储在sessionStorage中
重定向用户时，将其作为url参数传递


如果使用这些方法中的任何一种，则可以在FormComponent中检查该值是否存在并相应地执行操作。

范例程式码

OrderListComponent

let handleChange = (value) => {
  localStorage.orderListValue = value
}

这也将取代任何现有的价值。在这里使用您的大脑。

FormComponent

if ( localStorage.orderListValue ) {
  console.log('Yay.. we have data');
} else {
 // ask the user to select the List first.
}