如何解决动态设置位置时require()抛出异常
useEffect(() => {
axios.get(API_BASE_URL + '/user/images',payload)
.then(function (response) {
if (response.status >= 200 && response.status < 300) {
console.log("RESPONSE IMAGE:" + JSON.stringify(response.data,null,2));
let files = response.data.files[0];
const requirestring = "../../images/public/" + files;
let requireimg;
if(files == null){
requireimg = require("../../images/basic-profile-picture.jpg");
}else {
try{
>> requireimg = require(requirestring);
}catch (e){
requireimg = require("../../images/basic-profile-picture.jpg");
}
}
setMapImages(<Image className={"profilepicture"} src={requireimg.default} alt={"TEXT"} />);
} else {
alert("error getting images");
}
})
.catch(function (error) {
console.log("DOWNLOAD: " + error);
});
为什么是这个部分:
requireimg = require(requirestring);
抛出这个异常:
Cannot find module '../../images/public/600bc441b2b2b62c542bd135_profilepicture.jpg'
但这有效并且不会以某种方式抛出异常:
requireimg = require("../../images/public/600bc441b2b2b62c542bd135_profilepicture.jpg")
当我将图像名称设置为“_”以获得更好的语法时,第一次发生异常。
解决方法
发生这种情况是因为 require 不是 JavaScript API 原生函数,而是 Node 函数。 因此,当您尝试在浏览器中运行时,浏览器无法识别以变量为参数的 require 函数。
查看此stackoverflow link了解更多详细信息
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。