在 _app.js (nextjs) 中收到新道具?
Receive new props in _app.js (nextjs)?
我想说,如果我在 _app 的 componentDidMount 中派发一个动作,我可以在 _app 中收到这个动作的新道具吗?如果是,怎么办?谢谢
import React from 'react'
import {Provider} from 'react-redux'
import App, {Container} from 'next/app'
import withRedux from 'next-redux-wrapper'
import withReduxSaga from 'next-redux-saga'
import configureStore from './configure-store'
class ExampleApp extends App {
static async getInitialProps({Component, ctx}) {
let pageProps = {}
//This a action with redux-saga
ctx.store.dispatch(doSomething)
if (Component.getInitialProps) {
pageProps = await Component.getInitialProps(ctx)
}
return {pageProps}
}
render() {
const {Component, pageProps, store} = this.props
return (
<Container>
<Provider store={store}>
<Component {...pageProps} />
</Provider>
</Container>
)
}
}
export default withRedux(configureStore)(withReduxSaga(ExampleApp))
在这段代码中,我如何以及在哪里可以恢复我的操作结果?
我的配置商店:
import reducers from "./services/reducers";
import { createStore, applyMiddleware, compose } from "redux";
import createSagaMiddleware from "redux-saga";
import IndexSaga from "./services/sagas";
export const configureStore = (preloadedState, { isServer, req = null }) => {
const composeEnhancers =
(typeof window !== "undefined" &&
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__) ||
compose;
const sagaMiddleware = createSagaMiddleware();
const store = createStore(
reducers,
preloadedState,
composeEnhancers(applyMiddleware(sagaMiddleware))
);
if (req || !isServer) {
store.sagaTask = sagaMiddleware.run(IndexSaga);
}
return store;
};
然后回到您的商店并从那里带来一些更新的价值。
....
const store = configureStore.getState();
我想说,如果我在 _app 的 componentDidMount 中派发一个动作,我可以在 _app 中收到这个动作的新道具吗?如果是,怎么办?谢谢
import React from 'react'
import {Provider} from 'react-redux'
import App, {Container} from 'next/app'
import withRedux from 'next-redux-wrapper'
import withReduxSaga from 'next-redux-saga'
import configureStore from './configure-store'
class ExampleApp extends App {
static async getInitialProps({Component, ctx}) {
let pageProps = {}
//This a action with redux-saga
ctx.store.dispatch(doSomething)
if (Component.getInitialProps) {
pageProps = await Component.getInitialProps(ctx)
}
return {pageProps}
}
render() {
const {Component, pageProps, store} = this.props
return (
<Container>
<Provider store={store}>
<Component {...pageProps} />
</Provider>
</Container>
)
}
}
export default withRedux(configureStore)(withReduxSaga(ExampleApp))
在这段代码中,我如何以及在哪里可以恢复我的操作结果?
我的配置商店:
import reducers from "./services/reducers";
import { createStore, applyMiddleware, compose } from "redux";
import createSagaMiddleware from "redux-saga";
import IndexSaga from "./services/sagas";
export const configureStore = (preloadedState, { isServer, req = null }) => {
const composeEnhancers =
(typeof window !== "undefined" &&
window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__) ||
compose;
const sagaMiddleware = createSagaMiddleware();
const store = createStore(
reducers,
preloadedState,
composeEnhancers(applyMiddleware(sagaMiddleware))
);
if (req || !isServer) {
store.sagaTask = sagaMiddleware.run(IndexSaga);
}
return store;
};
然后回到您的商店并从那里带来一些更新的价值。
....
const store = configureStore.getState();