Question

当前试图实现一个背景，该背景根据组件接收到的道具而变化，但是我尝试做的很多事情似乎会导致错误或根本不显示背景。

我似乎能够在react中设置背景的唯一方法是键入url（）内的路径。尝试构建字符串的任何其他方法（如在公共路径的末尾添加图像名称），然后将字符串作为组件中的一项道具放置或仅作为字符串传递似乎都不起作用。

这是我最近的尝试：


  getBackgroundURL () {
    var imageUrl = this.state.game.backgroundUrl;
    return { backgroundImage: "url(" + require(imageUrl) + ")" };

  };

这是最近一次尝试收到的错误： “错误：找不到模块'（aCorrectPath）.jpg'

如果您有任何解决方法，谢谢您的帮助。

经过一番评论后，我应该添加一些我尝试过但无法正常工作的东西。

  getBackgroundURL () {
    var imageUrl = `../resources/${this.getGameName(false)}BackGround.jpg`;
    return { backgroundImage: "url(" + require(imageUrl) + ")" };
  };

此错误导致上述相同错误。如果不使用Require，我根本不会收到任何背景图片。

唯一可行的方法

  getBackgroundURL () {
    return { backgroundImage: "url(" + require("../resources/GameNameBackGround.jpg") + ")" };
  };

Answer 1

我找到了解决方案，在根据评论回顾相对路径之后。以下代码有效：

  getBackgroundURL () {
    return { backgroundImage: "url(" + require(`../resources/${this.getGameName(false)}BackGround.jpg`) + ")" };
  };

此操作与上面的尝试之间的区别在于。相对路径放在函数内部而不是变量中，然后将变量放入返回值中。

不确定这有什么区别，但可以。感谢您的帮助。

需求似乎导致找不到存在的模块的模块

1 个答案: