如何访问全局 scope 中的 reactjs usestate 值？

Question

我有以下 reactJS 代码 -

useEffect(()=>{
    const getinterviewerDetails= async ()=>{
      const data1 = await axios.get("http://localhost:8083/api/GetProduct")
      .then(response => {
        console.log("role is "+response.data[0].role)
        setinterviewerDetails(response.data)
        var cars = response.data,
        result = cars.reduce(function (r, a) {
            r[a.role] = r[a.role] || [];
            r[a.role].push(a);
            return r;
        }, Object.create(null));
        console.log("result is : ",result);
        console.log(interviewerDetails)
    })
    .catch(error => { console.log(error) })
    setinterviewerDetails(data1);
    };  
  getinterviewerDetails();
  },[])

从中我需要从useEffect function 中获取全局 scope 中的结果值。 我尝试这样做只是通过从 function scope 外部声明变量，然后使用useEffect scope 对其进行初始化。 但是，它赋予了未定义的价值。 我怎样才能完成它？ 我只需要从全局 scope 访问结果值。

Answer 1

我认为一种方法是创建上下文（ https://en.reactjs.org/docs/hooks-reference.html#usecontext ）并将变量放入其中。

其他方法是在父组件中通过 useState 声明变量并将 setState function 传递给子组件

Answer 2

一种方法是填充 window object。 也就是说，将结果作为属性添加到 window object。 由于 window 是全局的，您可能会得到所需的 output。

window.result = result;

然后你可以在任何你想要的地方使用它，尽管我认为在 React 中没有必要这样做。 你应该尝试使用状态和上下文，而不是在使用 React 时这样做。 否则，正如@Lah Ezcen 评论的那样，您也可以尝试使用本地存储。