通过 React 中另一个文件夹中的页面访问文件夹中的本地图像

Posted 2023-02-21

【中文标题】通过 React 中另一个文件夹中的页面访问文件夹中的本地图像

【英文标题】：Accessing a local image in a folder by a page in another folder in React

【发布时间】：2017-07-23 20:42:02

【问题描述】：

考虑带有图像“image.jpg”的文件夹 A 和带有 html 页面的文件夹 B，需要访问文件夹 A 中的图像以在 HTML 中显示图像。

以下代码有效

 <img src=require('../A/image.jpg')/> 

但是当我遍历一个类似的 JSON 时，

var list=['name':'aa','img'="../A/image.jpg",'name':'bb','img'="../A/image1.jpg"] , 

将它们分配给状态并注入到 React 组件中，例如，

<img src=require(this.state.image)/>

这不起作用。我只是得到“找不到模块../A/image.jpg”我不明白为什么。提前感谢您的解决方案。

【问题讨论】：

你用<img src=this.state.image />的时候怎么样？

@Ejaz 不，它不起作用。图像未加载。参考***.com/questions/42580130/…

【参考方案1】：

它不会起作用，因为 RequireJS 使用这样的正则表达式匹配

cjsRequireRegExp = /[^.]\s*require\s*\(\s*["']([^'"\s]+)["']\s*\)/g

它希望你的参数是一个声明性的字符串文字。

【讨论】：

我还是不明白逻辑。实际上，我觉得它无法在该相对 url 中找到模块。即使涉及到模式，当我尝试通过连接将 url 用引号括起来时，它也不起作用。你能提出解决这个问题的方法吗？