Question

我将如何导出useState挂钩？导出变量很简单，但是我不确定如何使用useState。

import React, { useState } from "react";

export const Storage = () => {
    [data, setData] = useState("")
}

如果我尝试将Storage导入某处并运行Storage.setData（），则会收到“ setData不是函数错误。

Answer 1

我认为你需要在其他地方使用组件状态，所以为了做到这一点，你可以在 React 中使用 useContext 并创建一个提供者，你可以将 setData 函数作为值传递给它，并在组件树的任何位置使用它

import React, { useState, createContext } from 'react';

export const DataContext = createContext('');

export const DataProvider = ({children}) => {
const [data, setData] = useState("");
return (
<DataContext.Provider value={{ setData }}>
  {children}
</DataContext.Provider>
);
}

现在您可以简单地在子组件中的任何位置使用 setData。我希望它能解决问题。

在需要使用它的其他文件中，您可以简单地将状态值更新为

export const Component = () => {
const {setData} = useContext(DataContext);
useEffect(()=>{
setData('updated data');
},[])
}
return(<>children component updating the state</>);
}

导出useState挂钩

1 个答案: