反应路由器刷新404

时间:2020-04-29 17:49:43

标签: reactjs react-router

我有基本的React应用。

struct ItemCell: View {
    var body: some View {
        VStack {
            Spacer()
            CustomImageView(from: imageURL, placeholder: PlaceholderView(), config: { $0.resizable() })
                .aspectRatio(contentMode: .fit)
                .frame(maxWidth: 150, idealHeight: 190)
        }

    }
}

About.js

    import React, { Component } from 'react'
    import ReactDOM from 'react-dom'
    import {BrowserRouter as Router, Link, Route} from 'react-router-dom'
    import registerServiceWorker from './registerServiceWorker';
    import './App.css'
    import About from './routerTest/About';
    import Users from './routerTest/Users';
    import User from './routerTest/User';

     class App extends Component {

      render() {
        return (
    <div className="App">
  <header>
    <Link to="/">Home</Link>
    <Link to="/about">About</Link>
    <Link to="/users">Users</Link>
    </header>
    <Route  path="/about"   component={About}/>
    <Route  path="/users"   component={Users}/>
    <Route  path="/" exact HomePage  render={() => <h1>HomePage</h1>}/>

    </div>
          )
      }
    }


    ReactDOM.render(
      <Router>
       <App />


      </Router>
      , document.getElementById('root'));
      registerServiceWorker();

当我在本地主机上工作时,一切正常。但是,当我将其部署到任何托管服务。(例如:alwaysdata,webhost)并以任何路由刷新页面时,都会给我错误。您无权访问此服务器上的/ about。怎么了

1 个答案:

答案 0 :(得分:0)

对于React Router V4用户:

<Router history={hashHistory} >
does not work in V4, please use HashRouter instead:

import { HashRouter } from 'react-router-dom'

<HashRouter>
  <App/>
</HashRouter>