在 TypeScript React Hooks 项目中获取 Redux 存储在其他组件中的值,可以通过以下步骤实现:
npm install redux react-redux
import { createStore } from 'redux';
import rootReducer from './reducers';
const store = createStore(rootReducer);
<Provider>
组件将 Redux 存储传递给整个应用程序。例如:import { Provider } from 'react-redux';
import store from './store';
const App = () => {
return (
<Provider store={store}>
{/* 应用程序的其他组件 */}
</Provider>
);
}
useSelector
钩子函数来获取存储中的值。例如:import { useSelector } from 'react-redux';
const MyComponent = () => {
const value = useSelector(state => state.myReducer.value);
// 使用获取到的值进行其他操作
return (
// 组件的 JSX
);
}
在上述代码中,state
参数表示整个 Redux 存储的状态对象,myReducer
是你定义的 reducer 函数的名称,value
是存储中的某个值。
需要注意的是,useSelector
钩子函数接受一个回调函数作为参数,该回调函数用于选择存储中的特定值。你可以根据自己的需求进行修改。
这是一个基本的示例,你可以根据自己的项目需求进行适当的调整和扩展。如果你想了解更多关于 Redux 的详细信息,可以参考腾讯云提供的 Redux 相关文档和产品介绍:
希望以上信息对你有所帮助!
领取专属 10元无门槛券
手把手带您无忧上云