首页 > 解决方案 > 为什么即使从 bootstrap4-react 导入 BImg 后,我的图像也没有显示在浏览器中?

问题描述

我正在关注以下文档:- https://bootstrap-4-react.com/#documentation/components/navbar

我正在尝试实现以下代码。

import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import { Navbar, Nav, Button, Dropdown, Form, Collapse } from 'bootstrap-4-react';
import { BImg } from 'bootstrap-4-react';
export default class Header extends Component {
render() {
const bootstrap_icon = 'C:\md5\public\logo.svg';
return (
<Navbar expand="lg" light bg="light">
<Navbar.Brand href="#">
<BImg
src={bootstrap_icon}
width="30"
height="30"
display="inline-block"
align="top"
mr="1"
/>
</Navbar.Brand>
</Navbar>
)}}

但我没有得到图像输出。我尝试定义不同的路径。

没有任何内容显示为输出1

标签: reactjsreact-navigationreact-bootstrapreact-componentreact-bootstrap4-modal

解决方案


图像必须放在公用文件夹中。然后无需定义完整路径。然后是 const bootstrap_icon = 'logo.svg';


推荐阅读