我有一個使用 Next.js 構建的 React 應用程序。我希望能夠登錄然后使應用程序重新呈現,以便它嘗試獲取當前登錄的用戶。我的_app.js組件與 apollo 提供程序包裝在一起,并且還有一個獲取用戶查詢:class MyApp extends App { render() { const { Component, pageProps, apolloClient } = this.props; return ( <> <Container> <ApolloProvider client={apolloClient}> <Query query={GET_USER} fetchPolicy="network-only" errorPolicy="ignore"> {({ loading, data, error }) => console.log("rendering app", data) || ( <> <Component {...pageProps} user={data && data.me} /> </> )} </Query> </ApolloProvider> </Container> </> ); }}然后我有一個登錄表單,它只是將電子郵件和密碼發送到我的 API,然后返回一個帶有訪問令牌的 set-cookie 令牌標頭。<Mutation mutation={LOGIN} onError={error => { this.setState({error: "Incorrect email or password"}) }} onCompleted={() => { window.location.reload() // temp solution to cause app to re-render }}> {(login, {loading}) => ( <Login {...this.props} login={login} loading={loading} error={error} /> )}</Mutation>我可以成功登錄,但我希望 Apollo 緩存能夠與用戶數據一起寫入:{ "data": { "login": { "_id": "abcd1234", "accessToken": "abc123", "firstName": "First", "lastName": "Last", "email": "[email protected]", "__typename": "User" } }}隨著緩存被寫入,我期待 _app.js / ApolloProvider 子節點在從緩存中接收道具時重新渲染。我的 get user Query 然后應該嘗試再次運行(這次使用在 cookie 中設置的訪問令牌)并且應該返回一個用戶(表明用戶已登錄)。為什么我的突變沒有告訴我的應用程序重新渲染 onCompleted?
變異后如何強制App重新渲染?
米琪卡哇伊
2021-06-28 08:25:49