react中配置图片容错

发表于2022-09-15|更新于2026-02-24

|浏览量:

爱情是友谊的精华，书信是爱情的妙药——豪厄尔

之前写了:vue中img错误默认图片以及img图片丢失后默认图

今天写个react版本的：

1	<img src={xxxx} onError={(e) => e.target.src = '/img/oss/2020-06-01/head.jpg'} alt={value.alt} />

代码很简单，也很管用

相关推荐

笑长命，哭生病。——佚名分享一个验证码库在线体验http://captcha.tianai.cloud 使用方式http://doc.captcha.tianai.cloud 源码地址https://gitee.com/dromara/tianai-captcha https://github.com/dromara/tianai-captcha tianai-captcha简称tac，是一款集成滑动类、点选类的一款行为验证码，以使用简单、安全性强、界面美观、接入方便而，是为集好看、功能多、安全性强的一款开源行为验证码工具。今天tianai-captcha加入dromara，热烈欢迎

少年易学老难成，一寸光阴不可轻。——朱熹 Effect：为 TypeScript 生产应用准备的一套可靠性语言项目地址：https://github.com/Effect-TS/effect TypeScript 的世界里，写出能运行的代码并不总是最难的部分。真正棘手的，往往是代码开始面对现实之后。网络请求会失败，依赖会缺失，数据库会暂时不可用，异步任务会交错执行，配置会变化，日志与追踪需要被补上，测试环境与生产环境又有着不同的要求。代码规模一旦增长，这些问题不会单独到来，而会彼此纠缠，慢慢变成项目长期维护中的重量。 Effect 想处理的，就是这部分重量。它是一个用于构建健壮、可维护、类型安全且面向生产环境 TypeScript 应用的库。它关注的不是让代码看起来更抽象，而是帮助开发者在规模化开发中处理类型化错误、依赖注入、并发、缓存、资源管理、可观测性以及流式数据等复杂问题。 Effect 的方向很明确：让生产级应用中的不确定性，不再只能依赖约定、注释和经验来维持。当应用开始复杂，问题才真正出现一个简单的函数可以接收输入，返回输出。但一个真实服务通常需要做得更多...

display:contents

多少人以友谊的名义，爱着一个人。——电影《One Day》 MDN：https://developer.mozilla.org/zh-CN/docs/Web/CSS/display-box 首先是一段代码： 12345678910111213141516171819<!DOCTYPE html><head> <title>display</title> <style> .outer { border: 2px solid red; width: 300px; } .outer>div { border: 1px solid green; } </style></head><body> <div class="outer"> <div>I...

置顶小标签

美色不同面，皆佳于目；悲音不共声，皆快于耳。——王充原理是通过一个红色div加红色背景颜色，旋转45后度再整个边框设置超出部分隐藏效果如下：代码： 12345<div class="top-article-tag-parent"> <div class="top-article-tag"> 置顶 </div></div> 样式： 123456789101112131415161718.top-article-tag-parent { overflow: hidden; position: absolute; right: 46rpx; height: 80rpx; width: 100rpx; zoom: 0.8;}.top-article-tag { color: #fff; background-color: #ff0000; width: 150rpx; height: 40rpx; text-align: cente...

无论掌握哪一种知识，对智力都是有用的，它会把无用的东西抛开而把好的东西保留住。——达·芬奇分享一个前端消息提示组件库ToastifyJs https://github.com/apvarun/toastify-js 引入： 1npm install --save toastify-js 或者 123<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/toastify-js/src/toastify.min.css"><script src="https://cdn.jsdelivr.net/npm/toastify-js"></script> 使用： 1Toastify({ text: "This is a toast", duration: 3000 }).showToast(); 复杂例子： 123456789101...

天下之事不难于立法，而难于法之必行。一一明·张居正 EdgeOne Pages：腾讯云推出的现代前端开发与部署新体验在现代 Web 开发持续演进的大潮中，开发者对前端托管、性能优化、无服务器化和全球加速的需求日益提升。腾讯云基于其强大的 EdgeOne 边缘计算基础设施，推出了面向开发者的全新前端平台——EdgeOne Pages，为构建、部署和加速静态站点及无服务器应用带来极致体验。一、什么是 EdgeOne Pages？EdgeOne Pages 是一站式前端开发与部署平台，专为现代 Web 项目量身定做。它不仅支持静态页面的极速托管，还内置边缘 Serverless 能力，让你用 JavaScript 直接在全球边缘节点编写动态服务，无需管理服务器或基础设施，轻松实现低延迟、全球可用的前后端一体化应用。二、核心产品优势1. 全球加速，极致性能依托腾讯云分布全球的边缘节点，EdgeOne Pages 能将静态资源自动缓存到离用户最近的位置，大幅提升页面打开速度和访问体验。无论访客来自国内外，网站都能保持高可用和低延时。 2. 极简部署，自动化上线集成高效的自动...

阿超

我的名字叫阿超年龄25岁家在北京市职业是软件开发每天最晚也会在八点前回家不抽烟酒浅尝辄止晚上十二点上床保证睡足八个小时睡前写一篇博客再做二十分钟俯卧撑暖身然后再睡觉基本能熟睡到天亮像婴儿一样不留下任何疲劳和压力就这样迎来第二天的早晨健康检查结果也显示我很正常我想说明我是一个不论何时都追求内心平稳的人不拘泥于胜负不纠结于烦恼不树立使我夜不能寐的敌人这就是我在这社会的生活态度

数据加载中