Question

我花了好几天试图找出这个问题，我不知道它可能是什么。我测试了一切。

我在本地设置了一个ReactJS项目，我有一个登录页面，然后将您重定向到一个页面，然后是几个需要登录才能查看它们的页面。这一切都在当地完美运作。当我将它推送到应该像我的环境一样设置的登台服务器时，它是一个docker环境，那么这一个功能就会破坏：当你登录它时，它不会将URL改为＆＃34; /＆＃34;，它只停留在＆＃34; / login＆＃34;。页脚和页眉都出现（它们只设置为登录后显示），所以我不确定为什么会发生这种情况。

我可以点击菜单链接并按预期转到任何页面，似乎只是自动重定向无法正常工作。

代码（删除不相关的代码）：

import React, { Component, PropTypes } from 'react';
import { connect } from 'react-redux';
import {
    Alert,
} from 'react-bootstrap';
import { browserHistory } from 'react-router';
import { login } from '../../Actions/login';

class LoginForm extends Component {
    static propTypes = {
        login: PropTypes.func.isRequired,
        loggedIn: PropTypes.bool.isRequired,
        loggingIn: PropTypes.bool.isRequired,
        error: PropTypes.bool,
    }

    static contextTypes = {
        router: PropTypes.object,
    };

    constructor(props) {
        super(props);
        this.state = {
            email: null,
            password: null,
            invalidEmail: false,
            invalidPassword: false,
        };
    }

    componentWillReceiveProps(nextProps) {
        if (nextProps.loggedIn) {
            this.context.router.push('/');
            //browserHistory.push('/');
        }
    }
}

我已经尝试了两个：this.context.router.push('/');和browserHistory.push('/');，它们都在本地工作，但都不在服务器上工作。

Answer 1

试试this.context.router.history.push('/')。我有一段时间遇到同样的问题，这就解决了。但是，我找不到任何关于它的文档。

Answer 2

同样发生在我们当前的堆栈中，包括webpack2（babel v6），react-router v4，react-router-redux v5alpha和history v4。

生产包发生了一些差异。虽然路由在webpack-dev-server（包括historyApiFallback）上的dev env中运行良好，但是由docker容器内的nginx提供服务的生产包会更改url但会停在那里。 @@路由器更改操作虽然已发送。

为我们解决问题的是在应用程序周围使用HOC包装器withRouter。

https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/withRouter.md

我们认为该问题在开发环境中未被发现导致

import { AppContainer } from 'react-hot-loader'

if (module.hot) {
    module.hot.accept('./App', () => {
        const NextApp = require('./App').default
        ReactDOM.render(wrapedApp(NextApp, store), rootEl)
    })
}

无所畏惧地重新渲染。

React Router browserHistory.push（＆＃39; /＆＃39;）无法在docker服务器上运行，在本地运行

2 个答案: