相关疑难解决方法(0)

如何在React Router v4中推送到历史记录?

在当前版本的React Router(v3)中,我可以接受服务器响应并使用它browserHistory.push来转到相应的响应页面.但是,这在v4中不可用,我不确定处理它的适当方法是什么.

在此示例中,使用Redux,在用户提交表单时调用components/app-product-form.jsthis.props.addProduct(props).当服务器返回成功时,用户将进入购物车页面.

// actions/index.js
export function addProduct(props) {
  return dispatch =>
    axios.post(`${ROOT_URL}/cart`, props, config)
      .then(response => {
        dispatch({ type: types.AUTH_USER });
        localStorage.setItem('token', response.data.token);
        browserHistory.push('/cart'); // no longer in React Router V4
      });
}
Run Code Online (Sandbox Code Playgroud)

如何从React Router v4的功能重定向到Cart页面?

reactjs react-router react-router-v4

315
推荐指数
12
解决办法
41万
查看次数

React history.push()正在更新url但不在浏览器中导航到它

到目前为止,我已经阅读了很多关于react-router v4和npm历史库的内容,但似乎没有人帮助我.

我的代码按预期运行,直到它应该导航并在使用history.push()方法更改url时执行简单的重定向.URL正在更改为指定的路由,但不会在按钮上执行重定向.在此先感谢,仍在学习反应路由器......

我想按钮按钮在没有{forceRefresh:true}的情况下进行简单的重定向,然后重新加载整个页面.

import React from 'react';
import createBrowserHistory from 'history/createBrowserHistory';

const history = createBrowserHistory({forceRefresh:true});

export default class Link extends React.Component {
  onLogout() {
    history.push("/signup");
  }
  render() {
      return(
        <div>
          <h1>Your Links</h1>
          <button onClick={this.onLogout.bind(this)}>Log Out</button>
        </div>
      )
  }
}
Run Code Online (Sandbox Code Playgroud)

history.js react-router-v4

42
推荐指数
5
解决办法
3万
查看次数

使用react.push in action creator with react-router-v4?

我发现没有使用完成react-router-redux路由的唯一工作方法action creator async action是将historyprop从组件传递给action creator并执行:

history.push('routename');
Run Code Online (Sandbox Code Playgroud)

由于BrowserRouter忽略了传递给它的历史道具,因此我们不能将自定义历史对象与browserhistory一起使用.

解决这个问题的最佳方法是什么?

reactjs react-router redux react-redux react-router-v4

19
推荐指数
1
解决办法
5918
查看次数

React和Redux:行动后重定向

我使用React/Redux开发了一个网站,我使用thunk中间件来调用我的API.我的问题涉及行动后的重定向.

我真的不知道如何以及在哪里可以进行重定向:在我的操作中,在reducer中,在我的组件中,......?

我的动作如下:

export function deleteItem(id) {
    return {
        [CALL_API]: {
            endpoint: `item/${id}`,
            method: 'DELETE',
            types: [DELETE_ITEM_REQUEST, DELETE_ITEM_SUCCESS, DELETE_ITEM_FAILURE]
        },
        id
    };
}
Run Code Online (Sandbox Code Playgroud)

react-redux 已经在我的网站上实现,我知道我可以如下所示,但如果请求失败,我不想重定向使用:

router.push('/items');
Run Code Online (Sandbox Code Playgroud)

谢谢!

react-router redux

17
推荐指数
3
解决办法
2万
查看次数