相关疑难解决方法(0)

当使用 react-redux v5 设置 React v15.5 时,路由不导航

我是 React 的新手,我已经使用 Facebook 的create-react-app设置了我的 React 项目。以下是核心文件:

索引.js

import React from 'react';
import ReactDOM, { render } from 'react-dom';
import { BrowserRouter as Router } from 'react-router-dom';
import createHistory from 'history/createBrowserHistory';

import { createStore, applyMiddleware } from "redux";
import { Provider } from 'react-redux'
import { routerMiddleware, syncHistoryWithStore } from 'react-router-redux';
import thunk from 'redux-thunk';
import reducers from './reducers';

import App from './containers/App';
import Routes from "./Routes";

const browserHistory = createHistory();
middleware = routerMiddleware(browserHistory);
const store = createStore(reducers, …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-router react-redux react-router-redux

6
推荐指数
1
解决办法
1120
查看次数

React router dom 无法与 Link 一起使用,但刷新页面会加载组件

我有一个带有几条路线的 create-react-app 。当我时不时地改变分支等时,我注意到路由不起作用。我认为它唯一一次起作用是因为缓存。

下面是我的路线,为了简单起见,我blog用一个简单的p标签替换了路线,因为我开始认为它与我链接的组件有关。

应用程序.tsx

const history = createBrowserHistory();
...
<Router history={history} data-test="component-app">
   <Switch>
      <Route exact path="/" component={Main} />
      <Route path="/blog">
         <p>test</p>
      </Route>
   </Switch
</Router>

Run Code Online (Sandbox Code Playgroud)

主.tsx

import React from "react";
import { Link } from "react-router-dom";

export const Main = () => {

    return (
        <Link to="/blog">Blog</Link>
    )
}

Run Code Online (Sandbox Code Playgroud)

发生的情况如下:

  • 单击 Main = 中的 Blog 链接,浏览器中的路由更改为 localhost:9600/blog 但没有内容,只有一个白色页面
  • 在 localhost:9600/blog 上刷新页面,您将获得该<p>test</p>部分

但为什么点击链接后不立即显示测试呢?

我正在使用的版本:

  • 反应路由器-dom:“^ 5.2.0”
  • 反应脚本:“4.0.1”
  • 反应:“^17.0.1”
  • 历史记录:“^5.0.0”

有任何想法吗?

reactjs create-react-app react-router-dom

2
推荐指数
1
解决办法
6544
查看次数