如何訪問全局 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 評論的那樣，您也可以嘗試使用本地存儲。