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

代码很简单，也很管用

相关推荐

typescript-exercises（二）

亲善产生幸福，文明带来和谐。——雨果题目： 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566/*Intro: All 2 users liked the idea of the community. We should go forward and introduce some order. We are in Germany after all. Let's add a couple of admins. Initially, we only had users in the in-memory database. After introducing Admins, we need to fix the types so that everything works well together.Exercise: Type &q...

眼前的瞬间是一位威力强大的女神。——歌德 FossFLOW — 用于创建华丽等轴测图的开源神器在快速变化和高度技术化的现代世界中，“以图达意”的表达变得越来越重要。FossFLOW 应运而生，为开发者、设计师和工程师带来了领先的等轴测图设计工具。 📌 FossFLOW 是什么？FossFLOW 是一个开源的渐进式 Web 应用程序（PWA），致力于帮助用户轻松创建生动的等轴测技术图解。由现代前端框架 React 打造，并使用 fork 编辑后的 Isoflow 图形库（现已作为 fossflow 发布到 NPM），无需本地安装，完全基于浏览器，无需联网即可实现离线运行。 💡 功能特性详解以下是 FossFLOW 中的一些核心功能，与其他类似工��相比，它能够为用户提供极具创新性的体验： 🎨 专业级等轴测绘图：用简洁友好的方式创建 3D 风格的技术图。 💾 智能自动保存：每隔 5 秒自动保存，让您的设计过程无后顾之忧。 📱 渐进式 Web 应用支持（PWA）：可在 Mac 和 Linux 上安装为原生应用。 🔒 强调用户隐私：所有数据均本地存储于用户浏览器，无...

morjs转换小程序

健康是一种自由——在一切自由中首屈一指。——亚美路就是这个项目： https://github.com/eleme/morjs 基于小程序 DSL（微信、支付宝）的，可扩展的多端研发框架，支持一键将微信或支付宝小程序转换为微信、支付宝、百度、字节、QQ、快手、淘宝、钉钉等小程序或 Web 应用官网 https://mor.ele.me/ 快速上手快速上手环境准备MorJS 项目基于 node，请确保已具备较新的 node 环境（>=14），推荐使用 node 版本管理工具 nvm 来管理 node（Windows 下使用 nvm-windows），这样可以很方便地切换 node 版本，全局安装时候也不必再使用 sudo。 1# mac 或 linux 下安装 nvm$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash$ nvm -v0.39.1# 安装 node$ nvm install 14$ nvm use 14$ node -vv14....

芸芸众生，孰不爱生?爱生之极，进而爱群。 —— 秋瑾 Crawlee——一个用于 Node.js 的网络抓取和浏览器自动化库，用于构建可靠的爬虫。在 JavaScript 和 TypeScript 中。提取 AI、 LLMs 、RAG 或 GPT 的数据。从网站下载 HTML、PDF、JPG、PNG 和其他文件。适用于 Puppeteer、Playwright、Cheerio、JSDOM 和原始 HTTP。有头模式和无头模式。通过代理轮换。 Crawlee 涵盖了端到端的爬行和抓取，并帮助您构建可靠的抓取工具。快速地。即使使用默认配置，您的爬虫也会像人类一样出现并在现代机器人保护的雷达下飞行。 Crawlee 为您提供了在网络上抓取链接、抓取数据并将其存储到磁盘或云的工具，同时保持可配置以满足您的项目需求。 Crawlee 可作为crawlee NPM 包使用。 👉在Crawlee 项目网站上查看完整文档、指南和示例👈 Crawlee for Python 对早期采用者开放。 🐍 👉 查看源代码 👈 . 使用 Crawlee CLI 尝试 Crawlee ...

vue子组件调用父组件方法

强迫学习的东西是不会保存在心里的。——《柏拉图论教育》首先我们在子组件中这样定义 123456789101112131415<template> <div> <el-button @click="callSuper">123</el-button> </div></template><script>export default { methods: { callSuper() { this.$emit('parentEvent', '我的'); } }};</script> 这里的组件就只有一个el-button，点击后执行callSuper函数里面这行this.$emit('parentEvent', '我的');表示调用在父组件引用子组件时传入的事件例如我这里调用了parentEvent，传入了个“我的”...

回车提交表单

却是平流无石处，时时闻说有沉沦。——唐•杜荀鹤我们在页面开发中经常会写一些表单，但身为一个懒人，肯定是懒得点提交按钮的，我一般直接按回车提交当我们的form满足只有一个input的时候，回车事件是生效的 123<form> <input/></form> 当我们的form有多个input的时候，回车事件失效了 1234<form> <input/> <input/></form> 此时我们可以加一个input，让type=submit 即可再次满足回车提交效果 12345<form> <input/> <input/> <input type="submit"/></form> 如果要隐藏掉，使用样式display:hide隐藏即可但有时如果我们如果需要回车不提交表单，则可以避免上述条件如果想要不执行submit事件，可以直接在form上加一个onsubmit="return false&q...

阿超

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

数据加载中