如何在Reactjs中导入和使用图片? 我已经从一个文件夹中导入了所有图像,但它没有返回带有链接的数组。 检查这个。
function importAll(r) {
return r.keys().map(r);
}
const images = importAll(require.context('./', false, /\.(png|jpe?g|svg)$/));
console.log(images);
查看这个控制台截图:
请帮帮我!
文件夹结构:
--src>
--components>
Projects.jsx
--img>
images
我正在尝试将其导入到项目组件中。 但是,如何做到这一点?
import React from 'react';
import '../App.css';
function importAll(r) {
return r.keys().map(r);
}
const images = importAll(require.context('./', false, /\.(png|jpe?g|svg)$/));
console.log(images);
请帮助加载所有图像并使用它们。
最佳答案
您的正确要求是:
importAll(require.context('./img', false, /\.(png|jpe?g|svg)$/));
来自文档:
require.context('./test', false, /\.test\.js$/);
// a context with files from the test directory that can be required with a request endings with `.test.js`.
require.context('../', true, /\.stories\.js$/);
// a context with all files in the parent folder and descending folders ending with `.stories.js`.
关于javascript - webpack动态导入方法在reactjs中返回空数组而不是文件,如何解决?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53777194/