this.props.history.push（）无法与redux一起使用吗？

Question

我有LoginPage.js和NewLoginPage.js 。
它们执行相同的工作，但实现方式不同。

LoginPage.js ：
使用action与callback 。
这种情况下this.props.history.push('/select-teams')正常工作。

NewPageLogin.js ：
使用redux-thunk和callback 。
在这种情况下this.props.history.push('/select-teams')不起作用。

题：
我NewPageLogin.js错误的方式实现NewPageLogin.js ？

App.js

class App extends Component {
  //I will add security logic with last known location later.
  //Get the features done first
  render() {
    return (
      <Provider store={createStoreWithMiddleware(reducers)}>
        <BrowserRouter>
          <div>
            <Switch>
              <PrivateRoute exact path="/select-teams" isAuthorized={hasToken} component={SelectTeam}/>
              <Route path="/login" component={LoginPage}/>
              <Route component={PageNotFound}/>
            </Switch>
          </div>
        </BrowserRouter>
      </Provider>
    );
  }
}

NewLoginPage.js

onSubmit(values) {
    const {userid, password} = values;
    this.props.getToken(values, ()=>{
      if(this.props.isAuthenticated){
        console.log(this.props.isAuthenticated);
        console.log(this.props.history);
        this.props.history.push('/select-teams')
      }
    });
  }

LoginPage.js

onSubmit(values) {
    console.log(values);
    this.props.getTokenAuth(values, (res) => {
      console.log(res.status);
      if (res.status === 200) {
        localStorage.setItem('token', res.data.token);
        this.setState((prevState) => {
          return Object.assign(prevState, {
            isAuthenticated: true,
            statusCode: res.status,
            message: res.statusText
          });
        });
        this.props.history.push('/select-teams');
      } else {
        localStorage.removeItem('token');
        this.setState((prevState) => {
          return Object.assign(prevState, {
            isAuthenticated: false,
            statusCode: res.status,
            message: res.data.non_field_errors
          });
        });
      }
    })
  }

actions

export function getToken({userid, password}, callback) {
  const request = axios({
    method: 'POST',
    url: `${ROOT_URL}/api-token-auth/`,
    data: {
      username: userid,
      password: password
    }
  });
  return (dispatch) => {
    request.then((res) => {
        dispatch({
          type: GET_TOKEN_SUCCESS,
          payload: res.data.token
        });
        callback();
      })
      .catch((err) => {
        dispatch({
          type: GET_TOKEN_FAIL,
          payload: err
        });
        callback();
      });
  }
}
export function getTokenAuth({userid, password}, callback) {
  const data = {
    username: userid,
    password: password
  };
  const request = axios.post(`${ROOT_URL}/api-token-auth/`, data)
    .then((res) => {
      callback(res);
    })
    .catch((err) => {
      // localStorage.removeItem('token');
      callback(err.response);
    });
  //No return because it uses callback()
  return {
    type: GET_TOKEN_AUTH,
    payload: request
  }
}

gist完整源代码
App.js ：
https://gist.github.com/elcolie/2da32fb07b410a1965e1d7f5f204225a
NewLoginPage.js ：
https://gist.github.com/elcolie/b91f776963f8b9ea708d4f999304851a
LoginPage.js ：
https://gist.github.com/elcolie/b8cf985c48b834db1f065a04875ecd95

package.json

{
  "name": "frontend",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "axios": "0.17.1",
    "querystring": "^0.2.0",
    "react": "^16.2.0",
    "react-dom": "^16.2.0",
    "react-redux": "^5.0.6",
    "react-router": "^4.2.0",
    "react-router-dom": "^4.2.2",
    "react-scripts": "^1.0.17",
    "redux": "^3.7.2",
    "redux-form": "^7.2.0",
    "redux-promise": "^0.5.3",
    "redux-thunk": "^2.2.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

检查：