Question

我正在与React Router一起进行一个项目，试图构建一个完全在前端进行React的WordPress主题。当按预期浏览整个应用程序时，一切似乎都正常工作。但是，我有一个/ blog映射到Blog组件，并在刷新/ blog时将其重定向到博客帖子/ blog-component之一。这很奇怪，因为它甚至不是站点上的页面，它应该是/ blog / blog-component，因为这是其中的帖子之一。

如果您想确切了解正在发生的事情http://api.digitalreactor.co

，请点击此处链接到此演示

这是主应用程序组件的外观。

import React from "react";
import { BrowserRouter as Router, Route, Switch, Redirect } from "react-router-dom";
import Home from './pages/Home';
import Page from './pages/Page';
import BlogPost from './pages/BlogPost';
import Blog from './pages/Blog';
import Header from './components/Header';
import Footer from './components/Footer';

class App extends React.Component {
  render() {
    return (
      <Router>
        <div>
            <Header/>
              <Switch>
                <Route exact path="/" component={Home} />
                <Route exact path="/blog" component={Blog} />
                <Route path="/blog/:slug" component={BlogPost} />
                <Route path="/:slug" component={Page} />
              </Switch>
            <Footer/>
        </div>
      </Router>
    );
  }
}

export default App;

您还可以在此处查看存储库：https://github.com/freddiemixell/WordPress-React

这基本上与Create React App相似，只是所有事情都在/ react-src而不是/ src中发生

有趣的是：当刷新发生时，我注意到404错误正在触发。这意味着刷新时将调用<Route path="/:slug" component={Page} />。仅当WordPress REST API未返回页面标题时，该404才可用。

话虽这么说，还是可以通过使用withRouter检测this.props.location.pathname ==='/ blog /'来更改Page.js以重定向回Blog.js组件

未知的301重定向反应路由器

0 个答案: