Question

我正在创建一个React应用程序，并且正在使用next进行一些SSR。我还使用了redux和redux-saga，并且我拥有异步逻辑来更新应用程序的状态。为了简化操作，假设我的redux存储区中有一个status字段，该字段在应用启动时初始化。

我有一个名为StatusGate的组件，该组件将主页组件作为子组件，如果status存储区中的redux字段良好，则将其呈现。我必须为此组件禁用ssr，因为status在客户端和服务器端都不同，这给了我一个渲染错误。

这基本上就是我在_app.tsx渲染中所做的：

// Load the redux store, extract Component and pageProps from props

return <Container>
         <Provider store={store}>
           <NavBar>
             <StatusGate>
               <Component {...pageProps}/>
             </StatusGate>
           </NavBar>
         </Provider>
       </Container>;

在NavBar中，我从Link导入了next，将我带到/account页面。单击链接后，URL会正确更新，但Component呈现的内容却没有。

我发现很奇怪的是以下情况

// Load the redux store, extract Component and pageProps from props

return <Container>
         <Component {...pageProps}/>
         <Provider store={store}>
           <NavBar>
             <StatusGate>
               <Component {...pageProps}/>
             </StatusGate>
           </NavBar>
         </Provider>
       </Container>;

在这里，我将此Component渲染两次，一次渲染到所有组件的根，第二次渲染就像之前一样。现在，当我遵循Link时，第一个的内容已正确更新，而第二个的内容仍未更新。

我正在将next@8.0.1与Typescript，Css和Less一起使用。

你们已经遇到了这个问题吗？我在这里想念什么？

Next的<link />正确更新浏览器路径，但不能更新页面内容

0 个答案: