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} />

代码很简单，也很管用

相关推荐

CircularProgressBar

丈夫志四海，万里犹比邻。—— 曹植《赠白马王彪》 https://github.com/lopspower/CircularProgressBar Android 自定义控件推荐：CircularProgressBar 完美实现圆形进度条在 Android 开发中，进度条是一种非常常见的 UI 元素，用于展示任务的完成进度。虽然系统自带了 ProgressBar，但其样式单一，无法满足复杂的 UI 需求。为了解决这一问题，CircularProgressBar 提供了一种简单易用的解决方案，帮助我们轻松实现高度定制化的圆形进度条。本篇文章将为你详细介绍 CircularProgressBar 的功能、特点以及如何快速上手使用。什么是 CircularProgressBar？CircularProgressBar 是一个开源的自定义控件，用于实现 Android 中的圆形进度条。由 lopspower 开发，CircularProgressBar 提供了灵活的 API 和丰富的样式选项，可以轻松满足各种设计需求。 CircularProgressBar 的功能亮点高...

数组解构赋值

倘若A代表人生的成功，那么公式是：A =X+Y+Z。X是工作，Y是游戏，z是保持缄默。——（美）爱因斯坦我们以前从一个数组中获取第一项，可能是如下写法： 12let list = [1,2,3]let i = list[0] 有了解构赋值，可以如下写法： 12let list = [1,2,3]let [i] = list 如果稍微复杂点，例如下面这样从对象中取出来数组： 12let ruben = {hobby:['anime']}let favorite = ruben.hobby[0] 就可以写成： 12let ruben = {hobby:['anime']}let {hobby:[favorite]} = ruben 如果再复杂点 123let ruben = {hobby:['anime']}let achao = {favorite:undefined}achao.favorite =...

青春是一种持续的陶醉，是理智的狂热。——拉罗什富科分享一个vue图片裁剪组件官网：https://github.xyxiao.cn/vue-cropper/ 演示demo：http://github.xyxiao.cn/vue-cropper/example/ 还是很不错的 1. 安装1234# npm 安装npm install vue-cropper# yarn 安装yarn add vue-cropper 如果你没有使用 npm 在线例子vue-cropper + vue.2x 在线例子vue-cropper@next + vue.3x 服务器渲染 nuxt 解决方案设置为 ssr: false 1234567891011module.exports = { ... build: { vendor: [ 'vue-cropper ... plugins: [ { src: '~/plugins/vue-cropper', ssr: false } ...

export default和module.exports

我期望理解，但是也慢慢地感受到了一种责任，给予比接受伟大，去爱比被爱伟大。 ——海明威我们在vue项目中创建两个js 在util.js中写入 123export default { ruben: 'ruben'} 在api.js中写入 123module.exports = { vampire: 'vampire'} 我们再来一个页面中使用两种方式引用 123456789101112131415<script>import util from '@/common/util.js';import api from '@/common/api.js'const util1 = require('@/common/util.js')const api1 = require('@/common/api.js')export default{ created(){ co...

typescript-exercises（三）

青年人的教育是国家的基石。——富兰克林题面： 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970/*Intro: Since we already have some of the additional information about our users, it's a good idea to output it in a nice way.Exercise: Fix type errors in logPerson function. logPerson function should accept both User and Admin and should output relevant information according to the input: occupation for User an...

translate-ha-jimi

但愿苍生俱饱暖，不辞辛苦出山林。一一于谦哈基密语加密器 translate-ha-jimi：浏览器本地端到端加密，体验另类语言编码的乐趣！你是否曾想过，和好友聊天的内容能像“密语”一样，既神秘又安全，既有趣又防偷窥？现在，**哈基密语加密器（translate-ha-jimi）**就能满足你的所有幻想！它不仅是一款强大的浏览器本地端到端加密聊天工具，更以轻松娱乐为出发点，让学习加密算法、体验信息安全变得生动有趣。哈基密（哈吉米）的有趣来历“哈基密”或“哈吉米”这个词，实际上源自于日语“はちみつ”（hachimitsu，意为“蜂蜜”）的空耳发音。其灵感来自于热门动画《赛马娘》第二季第12集：剧中角色东海帝皇在买蜂蜜饮料时，嘴里哼唱着“哈基密哈基密”的小曲，俏皮又洗脑。自此，“哈基密”便在ACG圈层中成为一种极具特色的网络流行语，被大家用来调侃、加密、甚至“恶搞”语言内容，形成了独特的亚文化密码。项目简介translate-ha-jimi（哈基密语加密器）是一款专为聊天内容加密设计的本地工具，全部加密和解密过程都在你的浏览器本地完成，无需上传任何数据，保障你的信息...

阿超

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

数据加载中