如何处理reactjs中每个浏览器选项卡的单独状态？

Question

我们打开新窗口选项卡,其中包含基于列表中所选userId的userList.我这样打开新窗口:

this.props.getVisitDetails(this.props.userId)
var win = window.open('./requisition','_blank');
win.onload = function() { this.document.title = windowTittle; }
win.focus();
this.state.oldWindow.push(win);

我userId来自Redux商店.问题是如果我打开多个窗口选项卡,那么userId在每个窗口选项卡上将具有相同的功能userId,当您单击刷新时,所有窗口选项卡将具有相同的数据.所以我的问题是如何为每个窗口选项卡维护一个单独的状态？

注意:所有浏览器选项卡都共享我们使用createstore方法保存的相同存储状态,因此在我的情况下,visitid将在每行单击时更新,这将打开浏览器的新选项卡.这是数据"共享"的方式

Answer 1

您的商店不会在多个选项卡之间共享，因此每次您打开新选项卡时，整个应用程序都会再次加载并初始化新商店。因此，在您的情况下，简单的解决方案是打开新选项卡，其中 URL 包含 userId 作为查询参数(window.open('./requisition?userId=${userId}','_blank');)。这样您就可以在不同的浏览器选项卡中维护单独的 userId。