react中配置图片容错
发表于|更新于
|浏览量:
爱情是友谊的精华,书信是爱情的妙药——豪厄尔
之前写了:vue中img错误默认图片以及img图片丢失后默认图
今天写个react版本的:
1 | <img src={xxxx} onError={(e) => e.target.src = '/img/oss/2020-06-01/head.jpg'} alt={value.alt} /> |
代码很简单,也很管用

相关推荐
2022-10-24
瀑布流组件vue-waterfall
坦白直率的言语,最容易打动悲哀的耳朵——莎士比亚 分享一个vue瀑布流组件 vue-waterfall git地址:https://github.com/MopTym/vue-waterfall.git 竖向排列demo:http://app.moptym.com/vue-waterfall/demo/vertical-line.html 横向排列:http://app.moptym.com/vue-waterfall/demo/horizontal-line.html 竖向+变大:http://app.moptym.com/vue-waterfall/demo/vertical-line-with-grow.html
2025-05-17
pickr
业精于勤,荒于嬉。—— 韩 愈《进学解》 https://github.com/simonwep/pickr Pickr:一个简单、多主题、响应式且可定制的颜色选择器库在网页设计和前端开发中,颜色选择器是一个不可或缺的工具。虽然许多框架提供了内置的颜色选择器,但它们往往难以扩展或自定义。Pickr 是一个轻量级、无依赖的颜色选择器库,它提供了丰富的功能,同时完全兼容所有主流 CSS 框架。 什么是 Pickr?Pickr 是一个开源的颜色选择器库,支持多种颜色格式(如 rgba、hsla、hsva 等),并提供多种主题和自定义选项。它专为现代前端开发设计,具有以下特点: 核心特点: 无依赖:不依赖任何第三方库(如 jQuery)。 多格式支持:支持 rgba、hsla、hsva、hex 和 CMYK 格式。 多主题:内置多种主题样式,兼容主流 CSS 框架(如 Bootstrap、Materialize)。 响应式设计:适配移动端和桌面端。 自定义能力:可通过 JavaScript 和 CSS 轻松自定义外观和功能。 支持透明度:包括 alpha 通道的选择。 轻量级:小巧...
2021-08-21
Failed to resolve loader: less-loader
但愿苍生俱饱暖,不辞辛苦出山林。一一于谦 本来我今天遇到这个问题了 1Failed to resolve loader: less-loader You may need to install it 我一看:你可能需要安装一下less-loader,我直接输入命令安装 1cnpm i less-loader 执行完毕,再次运行发现报错信息变了: 1TypeError: this.getOptions is not a function 原来是版本太高了,于是卸载 1cnpm uni less-loader 然后安装低版本的 1cnpm i less-loader@6.0.0 再次启动就好了
2021-09-23
sessionStorage
勤奋是一种可以吸引一切美好事物的天然磁石。 ——罗•伯顿 前端除了localStorage还有sessionStorage localStorage即便关闭了浏览器,再次打开该页面仍然存在 但sessionStorage的作用于仅仅局限于当前标签页或通过当前标签页中的点击事件打开的新页面 localStorage一般用于用户token储存、主题设置等需要稍微长期持久化的场景 sessionStorage一般用于刷新页面记住分页页码、记住检索条件等关闭标签页即销毁的场景 sessionStorage的api和localStorage的api非常相似: 12// 存sessionStorage.setItem("ruben","ruben") 取出来: 12// 取sessionStorage.getItem("ruben")
2024-06-07
vue查看组件
人死像熟透的梨,离树而落,梨者,离也。——《活着》 最近在折腾 Vue.js,发现了一个挺有意思的东西,叫 Vue.options.components。先来个大概的解释,这货就是 Vue.js 用来存储全局组件的一个对象。每次你注册个全局组件,它就会乖乖地跑到 Vue.options.components 里去。 什么是 Vue.options.components?简单说,Vue.options.components 就是 Vue.js 全局组件的家。你每次用 Vue.component 注册个组件,它就会被扔进这个家里,然后你在任何地方都能用到它。感觉像是个全局变量,不过是专门为组件准备的。 全局注册组件先来个全局注册组件的例子吧,感觉这个比较好理解: 123Vue.component('my-component', { template: '<div>这是一个自定义组件!</div>'}); 这个时候,你可以通过 Vue.options.components 看到你刚才注册的组件:...
2024-07-09
css透视效果位置perspective-origin
真理是时间的孩子,不是权威的孩子。——伽利略 正如我们在前一篇文章中提到的,CSS具备处理3D变换的能力。继续这一话题,本文将重点介绍perspective-origin属性,这个属性允许我们调整透视效果的原点,影响3D变换的视觉输出。 详细信息可以参考这个链接:MDN文档 让我们通过一个例子来看看perspective-origin的实际效果: .cube { width: 100px; height: 100px; position: relative; transform-style: preserve-3d; transform: rotateX(45deg) rotateY(45deg); } .face { position: absolute; width: 100%; height: 100%; background: rgba(255, 165, 0, 0.8); display: flex; align-items: center; justify-cont...
