需要找不到要导入的图像路径

问题描述

我正在尝试根据随机和语言选择动态导入图像。 这是一个代码重构,所以这个代码在旧项目中运行良好。

它找不到模块并出错。 我想知道可能是什么问题以及我需要做些什么来解决它。

const BackgroundAnimation = () => {
  const currentList = useSelector((state) => state.list.currentList);
  const [animate,setAnimate] = useState(false);
  const [url,setUrl] = useState('url("")');
  const [nextUrl,setNextUrl] = useState("");

  const getBackgroundUrl = () => {
    const languageBG = getRandomLangCode();
    const basePath = "../../assets/backgrounds/";
    const src = require(`${basePath}desktop/bg-${languageBG}.jpg`);
    setNextUrl(src);
  };

  useEffect(() => {
    getBackgroundUrl();
  },[]);

  // Animation Loop
  useEffect(() => {
    setTimeout(() => {
      setAnimate(!animate);
      getBackgroundUrl();
    },6000);
  },[animate]);

  //Static Background
  useEffect(() => {
    if (currentList !== null && window.innerWidth <= 767) {
      const language = languagesBGKey[currentList.language.toLowerCase()];
      const languagesList = languages[language];
      const randomIndex = Math.floor(
        Math.random() * (languagesList.length - 1 - 0) + 0
      );
      const languageBG = languagesList[randomIndex][1];
      const src = require(`${basePath}mobile/bg-${languageBG}.jpg`);
      const url = `url(${src})`;

      setUrl(url);
    }
  },[currentList]);

  return (
    <>
      <img
        style={{ opacity: 0 }}
        src={nextUrl}
        onLoad={() => {
          setUrl(`url(${nextUrl})`);
        }}
        onError={(e) => {
          console.log(e);
        }}
      />
      <div
        id="backgroundAnimation"
        style={{
          backgroundImage: url,}}
      ></div>
    </>
  );
};

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)