React 和 React Router - 构建后主页组件未呈现答案

【问题标题】：React and React Router - Home page component not rendering after BuildReact 和 React Router - 构建后主页组件未呈现
【发布时间】：2018-07-16 23:33:11
【问题描述】：

我是 React 和 React Router 的新手，在我“编译”我的应用程序并尝试在我的服务器上运行它之后遇到了一些问题。背景：我使用 create-react-app 启动这个项目并一直在 VS Code 中进行开发，当我运行“npm run start”时，在 localhost:3000 上运行的浏览器窗口中一切都正确显示。当我运行“npm run build”时，它会将我的文件编译到构建文件夹中。当我将该文件夹的文件放入 WildFly 服务器上的 WebContent 文件夹时，我没有获得主页的内容。

代码：

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom';

const User = ({match}) => {
  return (<h1>Welcome User {match.params.username}</h1>)
}

class App extends Component {
  render() {
    return (
      <Router>
      <div className="App">
      <ul>
      <li>
      <Link to="/">Home</Link>
      </li>
      <li>
        <Link to="/about">About</Link>
        </li>
        <li>
        <Link to="/users">User</Link>
        </li>
      </ul>
        <Route path ="/" exact render={
          () => {
            return (<h1>Welcome Home</h1>);
          }
        }/>
        <Route path ="/about" exact render={
          () => {
            return (<h1>About</h1>);
          }
        }/>
        <Route path ="/user/:username" exact component={User} />
      </div>
      </Router>
    );
  }
}

export default App;

当我登陆 localhost:8080 时，我应该会看到“欢迎回家”的文字，但我看到的只是切换页面的按钮。这只是 React Router 的一个测试项目。我希望将与此类似的东西用于更大的项目，但我需要主页才能正确呈现。非常感谢任何帮助。

【问题讨论】：

您的实时页面的 URL 是什么？
按钮，你的意思是你代码中的链接标签是可见的吗？
是的，我指的是链接标签，抱歉。
至于实时页面，我目前没有实时页面，但如果有帮助，我可以提供我的页面。我对这种行为感到困惑，因为我在这里遵循 react-router 的教程：reacttraining.com/react-router/web/guides/quick-start

标签： javascript reactjs react-router-v4

【解决方案1】：

删除about和user route中的exact。

【讨论】：

【解决方案2】：

我能够通过合并哈希路由器来解决这个问题。这不是最好的解决方案，因为它在 url 中添加了一个 hash(#)，但是我的页面会呈现在 Wildfly 服务器上运行，所以我很高兴

【讨论】：