问题标签 [react-image]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
575 浏览

javascript - 状态改变时如何用另一个 React 组件替换它

我对 React 很陌生,这就是我想要完成的事情:

我想显示一个需要 3-4 秒才能加载的大图像,所以我想向用户展示一个加载器,这可以使用https://www.npmjs.com/package/react-image中的 ReactImage 来实现

然后我想添加一个缩放选项,但是缩放功能应该只有在图像加载成功后才能使用,所以我打算使用https://www.npmjs.com/package/react-image-magnify

但是,没有任何事件或可能的方法可以使这 2 个相互通信它们的状态,因此在我的render()函数中我可以选择使用 ReactImage 或 ReactImageMagnify。

任何帮助,将不胜感激。

这是一些伪代码,我有一个名为 的反应组件Preview,它有一个render()返回 ReactImage 或 ReactImageMagnify 的函数

0 投票
0 回答
34 浏览

javascript - 无法使用 react-images Lightbox 的属性

无法访问 onOpen 和 onAfterOpen、onAfterClose 属性。也无法找到 Lightbox 属性的文档。

0 投票
1 回答
48 浏览

reactjs - React-Images 和 React-Photo-Gallery 编译错误

我正在尝试安装 React-Photo-Gallery 和 React-Images 以获得灯箱画廊。

我收到此错误:

./~/react-scrolllock/dist/index.js 中的错误找不到模块:[CaseSensitivePathsPlugin]/Users/anmareewilliams/Apps/anmaree/anmaree/node_modules/react-scrolllock/dist/Scrolllock.js与磁盘上的相应路径不匹配ScrollLock.js

@ ./~/react-scrolllock/dist/index.js 7:18-41

我不确定我做错了什么,因为我没有触及与 Scrolllock 相关的任何内容,并且我看到 Scrolllock.js 实际上被命名为 dist/ScrollLock.js

任何帮助将非常感激。

谢谢你。

0 投票
1 回答
1234 浏览

javascript - 反应图像轮播

我正在尝试使用https://jossmac.github.io/react-images/实现图像/视频轮播

它应该是这样的,包括 modal : 在此处输入图像描述

我按照那里给出的代码片段,但它不起作用,我没有看到任何制作轮播的分步指南。

任何人都可以帮助一个codesandbox吗?

是否可以使用当前活动图像触发模态?

提前致谢。

0 投票
1 回答
1889 浏览

reactjs - 反应图像库

我正在尝试使用 React-images ( https://github.com/jossmac/react-images ) 构建一个图片库。

到目前为止,这是我的代码。

https://codesandbox.io/s/gallant-yalow-7srs6

在这里,我试图实现两件事:

  1. 实现模态,模态将使用基础图库中的当前选择图像打开。
  2. 更改页脚总视图的活动视图内的“of”。即目前它的“1 of 4”所以我需要这个像“1 / 4”

有人可以帮我吗?我有点迷路了:(

提前致谢。

0 投票
1 回答
1133 浏览

reactjs - 如何获取 React Native 镜像失败错误码

如果加载图像失败,则onError调用方法。但是它并没有告诉我们失败的原因。有没有办法找出为什么 RN 无法加载图像?是因为 404 或 500 还是用户没有连接到互联网?ETC

0 投票
1 回答
322 浏览

javascript - 来自 api 的反应图像标题错误可能与正确的索引有关

继续:如何让我的 react-multi-carousel 为我的 ReactJS 应用程序使用灯箱功能

我的应用程序将 react-images 用于灯箱,将 react-carousel-images 用于轮播。我的 api 有一个标题和图像。我遇到的问题是页脚标题中的标题始终作为所选图像出现,并且在灯箱轮播中不会改变。我认为这与所选图像的索引有关?到目前为止,我的代码是:

问题示例: https ://codesandbox.io/s/react-multi-corousal-issue-72s9o?file=/src/Slider.js

滑块.js

0 投票
4 回答
1692 浏览

reactjs - 如何访问 SCSS 中的 react 公共文件夹以导入图像

公共文件夹中有一个名为“img”的文件夹。如果我写这个,背景:url(img/hero2.jpg) no-repeat center; 然后它抛出这个错误。未找到模块:无法解析 'D:\Programming\react\redux-blog\src' 中的 './img/hero2.jpg'

如果我写这个背景: url(../public/img/hero1.jpg) no-repeat center; 然后它说这个。未找到模块:您尝试导入位于项目 src/ 目录之外的 ../public/img/hero1.jpg。不支持 src/ 之外的相对导入。

0 投票
2 回答
632 浏览

javascript - iOS旋转照片问题

我已经使用 React (CRA) 设置了 PWA。当我在 iOS 中上传图片并使用react-image-crop它进行裁剪时,它会横向显示裁剪后的图像,它适用于所有其他设备(台式机、安卓)。我看到了一些类似的问题,但我真的不明白是什么原因造成的以及如何解决它。

任何帮助/指导将不胜感激。

0 投票
0 回答
415 浏览

reactjs - 通过React axios以json格式而不是formdata发送多个图像数据?

我想发送多个图像以及其他一些字段,但我想以 JSON 格式而不是 formData 发送这些图像。

在服务器上,我使用 multer 进行图像存储。

请参阅 React 代码的链接。 https://codesandbox.io/s/react-hooks-usestate-1h8cw?file=/src/index.js:1017-1023

图像正在上传和显示,但我无法找到以 JSON 格式在服务器端发送图像的方法。

服务器端代码