使用 MDBIcon 时不会出现搜索图标答案

【问题标题】：The search icon won't appear when using MDBIcon使用 MDBIcon 时不会出现搜索图标
【发布时间】：2020-04-18 10:09:40
【问题描述】：

我想在 React Bootstrap 的导航栏中显示搜索图标和搜索栏

src/modules/home/Home.jsx

import React, { Component } from 'react'
import InformationTableView from '../../components/InformationTableView'
import { CustomButton } from '../../components/CustomButton'
import {Navbar } from 'react-bootstrap'
import { Form, Button, FormGroup, FormControl, ControlLabel ,InputGroup} from "react-bootstrap";
import ReactBootstrap, {Jumbotron, Col, Grid, Panel,NavDropdown} from 'react-bootstrap'
import { MDBCol, MDBIcon } from "mdbreact";
import 'mdbreact/dist/css/mdb.css'

class Home extends Component {
    render() {
        return (
            <div>

                <Navbar className="bg-light justify-content-between">
                    <Form inline>
                        <MDBCol md="6">
                            <form className="form-inline mt-4 mb-4">
                                <MDBIcon fab icon="search" />
                                <input className="form-control form-control-sm ml-3 w-75" type="text" placeholder="Account Number" aria-label="Search" />
                            </form>
                        </MDBCol>
                        <InputGroup>
                    </Form>
                </Navbar>

            </div>
        )
    }
}

export default Home

这段代码有错误吗？

【问题讨论】：

检查您的public/index.html中是否包含引导CSS链接

标签： reactjs react-bootstrap mdbreact

【解决方案1】：

您好，您错过了根文件中的 Fontawesome 样式表将此链接添加到您的 Html 根文件中

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

【讨论】：