Question

我想将不同Form中的值存储到全局对象中，然后使用React js检索。我有近5到10个单独的弹出窗体。什么是最好的方式

Answer 1

因为您没有指定存储此类对象的详细信息，原因或目的，所以存储它们的最简单方法是使用localStorage API，这样您就可以在会话期间和重新加载页面后检索它们：

localStorage.setItem('form1', JSON.stringify(formData));
const form1Data = localStorage.getItem('form1');

Answer 2

为什么您需要全局访问此表单数据的目的应该推动此决定，但一个选项是使用closure。它基本上是一个位于全局命名空间中的私有对象，可以从应用程序的任何位置进行更新。

只要您的应用程序（浏览器窗口）存在，您就可以从React应用程序中的任何位置设置或访问表单数据。如果你需要在浏览器会话之外坚持这个，那么我会使用像localStorage这样的东西。

这是一个简单的例子：

// FormData.js
var FormData = (function() {
  var someData = {};

  var getSomeData = function() {
    return someData;
  };

  var setSomeData = function(someData) {
    someData = JSON.parse(someData);
  };

  return {
    getSomeData: getSomeData,
    setSomeData: setSomeData
  }
})();

export default FormData;

当您想获取或设置表单数据时，您只需要import这个js文件。

使用

获取表单数据

import FormData from '/FormData';
var someData = FormData.getSomeData();

使用...

设置表单数据

import FormData from '/FormData';
FormData.setSomeData(newData);

存储来自不同Form的值的最佳方法 - React JS

2 个答案: