react中img引入本地图片的2种方式

  前言

  以前我们用img引入图片只需要如下即可

  

  但在react中不允许使用这种方式,会报错,下面我简单总结了2种方式

  方式一:通过!important引入(推荐)

  

  然后在img中直接引入变量即可,这个变量名字可任意取

  

  方式二:require方法引入

  require中只能写字符串,不能写变量

  

  注:一般推荐使用!important引入图片,具体原因截图某网友的回复,

     下面截图有一个错别字和多写了一个字,小于写成了小与,编译前面多写了一个变

  

原文地址:https://www.cnblogs.com/tu-0718/p/12530654.html

时间: 2024-08-25 14:21:35

react中img引入本地图片的2种方式的相关文章

UIImage加载本地图片的两种方式

UIImage加载图片方式一般有两种: (1)imagedNamed初始化:默认加载图片成功后会内存中缓存图片,这个方法用一个指定的名字在系统缓存中查找并返回一个图片对象.如果缓存中没有找到相应的图片对象,则从指定地方加载图片然后缓存对象,并返回这个图片对象. (2)imageWithContentsOfFile初始化:则仅只加载图片,不缓存. 大量使用imageNamed方式会在不需要缓存的地方额外增加开销CPU的时间来做这件事.当应用程序需要加载一张比较大的图片并且使用一次性,那么其实是没有

Unity加载本地图片的2种方式

1. 使用 WWW 加载,详细查看 unity3d 官方文档. 2. 使用 System.IO 加载,lua 代码如下: local File = luanet.import_type("System.IO.File"); local Texture2D=luanet.import_type("UnityEngine.Texture2D"); local TextureFormat=luanet.import_type("UnityEngine.Textu

angular 图片加载失败 情况处理? 如何在ionic中加载本地图片 ?

1.angular 图片加载失败 情况处理 在directive中定义组件,在ng-src错误时,调用err-src app.directive('errSrc',function(){ return { link: function(scope, element, attrs){ if(attrs.src == 'undefined'){ attrs.$set('src', attrs.errSrc); } element.bind('error', function() { if (attr

解决微信小程序开发中wxss中不能用本地图片

微信小程序开发中wxss中不能用本地图片,我们可以用将我们的图片传到服务器上,然后直接引用在线地址.但是当我们没有服务器时,我们可以用"图床",这个具体可以百度.这里我们用第二种方法:将图片用base64加密. 1.我们用在线加密对图片进行加密,这个网址百度一大堆,我只贴出一个http://imgbase64.duoshitong.com/ 2.将转换完成后的base64复制到我们要引用的地方. 3.设置样式(辅助代码,只有将这个图片做为background-image时注意设置如下属

vue-cli3中引入图片的几种方式和注意事项

如果你是在数据中引入图片,他是从项目中引入的应该按第一种方式引入 如果不是在数据中引入图片,按第二种方式引入 原文地址:https://www.cnblogs.com/jxnc/p/12266781.html

IOS数据本地存储的四种方式--

注:借鉴于:http://blog.csdn.net/jianjianyuer/article/details/8556024 在IOS开发过程中,不管是做什么应用,都会碰到数据保存问题.将数据保存到本地,能够让程序更加流畅,不会出现让人厌恶的菊花状,使得用户的体验更好.下面是介绍数据保存的方式 第一.NSKeyedArchiver:采用归档的形式来保存数据.(归档——解档)———大量数据和频繁读写不合适使用 1.归档器的作用是将任意的对象集合转换为字节流.这听起来像是NSPropertyLis

ios网络学习------4 UIWebView的加载本地数据的三种方式

UIWebView是IOS内置的浏览器,可以浏览网页,打开文档  html/htm  pdf   docx  txt等格式的文件.  safari浏览器就是通过UIWebView做的. 服务器将MIME的标识符等放入传送的数据中告诉浏览器使用那种插件读取相关文件. uiwebview加载各种本地文件(通过loadData方法): - (void)viewDidLoad { [super viewDidLoad]; [self setupUI]; NSString *path = [[NSBund

Struts2中获取HttpServletRequest,HttpSession等的几种方式

转自:http://www.kaifajie.cn/struts/8944.html package com.log; import java.io.IOException; import java.util.Map; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; import o

Java基础知识强化之IO流笔记44:IO流练习之 复制图片的 4 种方式案例

1. 复制图片的 4 种方式案例: 分析: 复制数据,如果我们知道用记事本打开并能够读懂,就用字符流,否则用字节流. 通过该原理,我们知道我们应该采用字节流. 而字节流有4种方式,所以做这个题目我们有4种方式.推荐掌握第4种. 数据源: c:\\a.jpg -- FileInputStream -- BufferedInputStream 目的地: d:\\b.jpg -- FileOutputStream -- BufferedOutputStream 2. 4 种方式代码示例: 1 pack