React 引入本地图片 img

最新推荐文章于 2024-07-09 22:33:20 发布

原创最新推荐文章于 2024-07-09 22:33:20 发布 · 1.8k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#reactjs #css

前端专栏收录该内容

3 篇文章

订阅专栏

在React框架中，直接使用< img />标签引入本地图片可能会遇到问题。本文介绍了最简单的方法来引入bmp，gif，jpg，jpeg和png格式的图片，并强调了< img />标签必须包含alt属性以避免jsx-a11y/alt-text报错。

React 引入本地图片 img

1- 在react框架中不能直接引入< img />标签

2- 在此提供一种最简单的引入图片的方法，这适用于以下文件扩展名：bmp，gif，jpg，jpeg和png。SVG文件被排除在外

import {AdminDiv} from './style'

import Pic from './assets/welcome.jpg'

class Admin extends Component {
    render() {
        return (
            <AdminDiv>
                <img src={Pic} alt="pic"></img>
            </AdminDiv>
        )
    }
}
export default Admin