代码之家 › 专栏 › 技术社区 › yotke

<NavLink/>不会触发@@router/LOCATION\u更改操作

connected-react-router react-router redux reactjs javascript

yotke · 技术社区 · 6 年前

<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 logger中有一个路由更改:

action @@router/LOCATION_CHANGE // console.log

我到处都找了,找不到我是否需要做一个自定义操作或使用连接的路由器。

感谢您的帮助

1 回复 | 直到 6 年前

yotke 6 年前

显然,我有 <Router /> <Switch /> 除了 <ConnectedRouter />

如果您想将路由连接到redux存储并在redux logger中反映路由的变化,您只需要 < 像这样:

<ConnectedRouter history={history}>
    <Nav />
    <Switch>
       <Route path="/" exact component={Home} />
       <Route path="/about-the-cause" exact component={About} />
       <Redirect to="/" />
    </Switch>
</ConnectedRouter>

推荐文章

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

4 月前

Facundo Cabrera · 意外的应用程序错误!useNavigate()只能在<Router>组件的上下文中使用

5 月前

user29295031 · 如何使用react和vite覆盖Tailwinds css 4默认设计

5 月前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

5 月前

Luckkks · 过渡色工作不正常

5 月前

ModernEraCaveman · 如何对齐我的Bootstrap容器以适应网页的整个宽度?

5 月前

vatsal chauhan · 即使在字体预加载时,文本加载也很慢

5 月前

hasratyan · Next.js 15 API路由-动态路由中的无效GET导出错误[id]

5 月前

noblerare · Vite错误-未定义导出(SSR)

5 月前

ProfessorFinesse · 在默认表单中完成帖子请求时,“res.send”会去哪里?

5 月前