Question

我在我的应用程序中使用react路由器，一切正常。以下是我的代码。问题是当我在线托管它时，它位于my-application子目录中：

https://www.example.com/my-application

这打破了代码，但它没有正常运行。

任何人都可以建议如何解决这个问题？如果有什么不清楚的地方请随意询问。我尝试了无数的方法，但无法让它发挥作用。可以看到一个答案here。

我得到的问题是，使用当前代码导航到https://www.example.com/test而不是https://www.example.com/my-application/test。我想如果我在网址中硬编码它会起作用，但这也打破了应用程序。

下面的代码略微缩小以删除多余的代码。

import React, { Component } from 'react';
import styled from 'styled-components'
import { Route, Switch } from 'react-router-dom'


const Home = ({ avatarUrl }) => {
  return (
      <div>
         <Route exact path="/" component={Overview}/>
         <Route path="/test" component={Test}/>
      </div>
  );
};

class App extends Component {

  render() {

    return (
      <section>
        <Nav avatarUrl={ this.props.avatarUrl }/>
        <Switch>
          <Route path="/example" component={Example}/>
          <Route path="/" render={()=><Home
            avatarUrl={ avatarUrl }
          />}/>

        </Switch>
      </section>
    )
  }
}

export default App

反应路由器托管与子文件夹问题

0 个答案: