我是next13的新手,我很难弄清楚如何在服务器组件中检索redux状态,比如我的主page.js文件。有人能告诉我获取这些数据的步骤吗?
page.js
vtwuwzda1#
您可以通过导入您的商店并直接调用store.getState()来访问服务器组件中的Redux状态。需要注意的是,服务器将无法访问在客户端上创建/存储的状态,如果您的状态最初是在客户端上设置的(即,通过useDispatch())。从我有限的测试中,我发现您需要使用store.dispatch(action(payload))从服务器组件设置状态。如果需要从客户端组件进行此分派,可以使用server action,如下所示:服务器组件:
store.getState()
useDispatch()
store.dispatch(action(payload))
export default async function PageName() { async function setStateFromServer(action, payload) { // this is the server action 'use server'; store.dispatch(action(payload)); } return ( <> <ClientComponent stateSetter={setStateFromServer}/> </> )
客户端组件:
'use client'; export const ClientComponent = ({ stateSetter }) => { const handleSetState = () => { stateSetter(someAction, somePayload) } return ... }
最后,您可以访问您的状态:
export default async function SomeServerComponent () { const state = store.getState(); ... }
1条答案
按热度按时间vtwuwzda1#
您可以通过导入您的商店并直接调用
store.getState()
来访问服务器组件中的Redux状态。需要注意的是,服务器将无法访问在客户端上创建/存储的状态,如果您的状态最初是在客户端上设置的(即,通过useDispatch()
)。从我有限的测试中,我发现您需要使用
store.dispatch(action(payload))
从服务器组件设置状态。如果需要从客户端组件进行此分派,可以使用server action,如下所示:服务器组件:
客户端组件:
最后,您可以访问您的状态: