0

单击 react-router<NavLink />组件时出现问题。目前，单击它时会导航到正确的页面，但在redux) 中没有触发任何操作。

历史对象更新。我可以说是因为后退/前进按预期工作（在 中触发动作redux-logger）。

这是剥离的代码：

import React from 'react';
import { connect } from 'react-redux';
import { NavLink } from 'react-router-dom';

import NavMenu from './NavMenu';

const Nav = () => {

  return (
    <aside>
      <NavMenu />
      <NavFooter>
        <NavLink to={`/terms-and-conditions`}> // Not firing redux-logger actions, but navigates to the correct page
          Terms and conditions
        </NavLink>
      </NavFooter>
    </aside>
  );
};

export default connect()(Nav);

当第一次加载和按下浏览器的后退/前进按钮时，redux 记录器中的路由发生了变化：

action @@router/LOCATION_CHANGE // console.log

我到处寻找，无法确定是否需要进行自定义操作或使用连接的反应路由器。

帮助表示赞赏

4

1 回答 1

4

显然，<Router />我<Switch />除了<ConnectedRouter />.

如果你想将路由连接到 redux store 并在 redux-logger 中反映路由的变化，你只需要<ConnectedRouter />这样：

<ConnectedRouter history={history}>
    <Nav />
    <Switch>
       <Route path="/" exact component={Home} />
       <Route path="/about-the-cause" exact component={About} />
       <Redirect to="/" />
    </Switch>
</ConnectedRouter>
于 2018-09-13T07:58:44.890 回答