簡體   English   中英

Redux狀態的歷史記錄不可用,但在React組件上可用

[英]history on redux state is not availb but it is available on react component

我的index.js看起來像:

const store = configureStore()

render(
    <Root history={history} store={store} />,
  document.getElementById('root')
)

我的Root.js看起來像:

class Root extends Component {
  render() {
    const { store } = this.props

    return (
      <Provider store={store}>
          <ReduxRouter />
      </Provider>
    )
  }
}

Root.propTypes = {
  store: PropTypes.object.isRequired,
  history: PropTypes.object
}

export default Root

和我的configureStore.js像:

export default function configureStore() {

  let createStoreWithMiddleware = compose(
    applyMiddleware(thunk),
    reduxReactRouter({ routes, createHistory })
    )(createStore)

  const store = createStoreWithMiddleware(rootReducer)

  return store

routes.js

const routes =  (
    <Router>
        <Route path={"/"} component={LoginView}>
        <Route path={"/login"} component={DashboardView} />
        </Route>
  </Router>
)

export default routes

和我的LoginView組件是這樣的:

class LoginView extends Component {

    componentDidMount(){
        const {actions} = this.props
        actions.login()
    }

    render() {
        console.log("printing props")
        console.log(this.props)
        console.log(this.props.history)
        return (
            <div>
                <Login />
            </div>
        )
    }
}

export default LoginView


function mapStateToProps(state) {
    return {
        login: state.login
    }
}

function mapDispatchToProps(dispatch) {
  return {
    actions: bindActionCreators(Actions, dispatch)
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(LoginView)

我對history很困惑。 在我的組件中,我正在獲取道具的history 就像this.props.history一樣,我已經在組件中完成了console.log(this.props.history)

但是在我的actions我無法獲得任何history

我的動作就像:

export function login(){

    return (dispatch, getState, history) => {
        console.log("get state")
        console.log(getState())
        console.log("history")
        console.log(history)
        var message = "hellooww world"
        return { message, type: loginTypes.LOGIN }
    }
}

在這里我可以獲取getState()但不能獲取history

如果我要redirect怎么辦? 我想要history以便可以像這樣重定向它:

history.pushState(null, '/dashboard')

誰能幫我.. ? 真的很困惑。

好吧,我發現此GitHub頁面提供了一種從操作過渡的簡單方法,也許會有所幫助(它有一個登錄操作示例):

https://github.com/johanneslumpe/redux-history-transitions

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM