Reactjs 导航菜单不'；在ReactCrudDemo教程中渲染

我正试着去追踪那个反应。本教程使用.NET Core 2，但我使用的是.NET Core 3.1，因此我遇到了一些无法解决的差异。一个是我的NavMenu没有正确呈现（但代码存在于DOM中）

我被卡住了，不知道怎么修。有人能帮我吗

我的应用程序看起来像：

它应该看起来像：

这是NavMenu.tsx中的代码：

import './NavMenu.css';    
import * as React from 'react';
import { Link, NavLink } from 'react-router-dom';

export class NavMenu extends React.Component<{}, {}> {
    public render() {
        return <div className='main-nav'>
            <div className='navbar navbar-inverse'>
                <div className='navbar-header'>
                    <button type='button' className='navbar-toggle' data-toggle='collapse' data-target='.navbar-collapse'>
                        <span className='sr-only'>Toggle navigation</span>
                        <span className='icon-bar'></span>
                        <span className='icon-bar'></span>
                        <span className='icon-bar'></span>
                    </button>
                    <Link className='navbar-brand' to={'/'}>ReactCrudDemo</Link>
                </div>
                <div className='clearfix'></div>
                <div className='navbar-collapse collapse'>
                    <ul className='nav navbar-nav'>
                        <li>
                            <NavLink to={'/'} exact activeClassName='active'>
                                <span className='glyphicon glyphicon-home'></span> Home
                            </NavLink>
                        </li>
                        <li>
                            <NavLink to={'/fetchemployee'} activeClassName='active'>
                                <span className='glyphicon glyphicon-th-list'></span> Fetch employee
                            </NavLink>
                        </li>
                    </ul>
                </div>
            </div>
        </div>;
    }
}

import./NavMenu.css'；
从“React”导入*作为React；
从'react router dom'导入{Link，NavLink}；
导出类导航菜单扩展了React.Component{
公共渲染（）{
返回
切换导航
雷克克鲁德莫


家


招收员工


;
}
}

这是Layout.js中的代码

import React, { Component } from 'react';
import { Container } from 'reactstrap';
import { NavMenu } from './NavMenu';

export class Layout extends Component {
  static displayName = Layout.name;

  render () {
    return (
      <div>
        <NavMenu />
        <Container>
          {this.props.children}
        </Container>
      </div>
    );
  }
}

import React，{Component}来自'React'；
从“reactstrap”导入{Container}；
从“/NavMenu”导入{NavMenu}；
导出类布局扩展组件{
静态显示名称=Layout.name；
渲染（）{
返回(
{this.props.children}
);
}
}

我的文件结构是：

这显示了DevTools中的网络选项卡

这是“源”选项卡。您可以看到NavMenu.tsx已加载。

---

当我单击导航菜单时，什么也没有发生，并且在开发工具中打开网络选项卡时，我在devtools刷新中没有发现任何错误。看看它是否向你的css js等发出请求并发布结果。@JoeLloyd谢谢你的关注！我已经发布了“网络和资源”选项卡。你看到原因了吗？是的，你从来没有要求css。在“网络”选项卡中，您没有任何样式。这就是为什么它没有样式。您需要将其添加到构建过程或静态文件夹中。