图像路径在React中不起作用，因为我试图在对象内部使用图像路径，该对象也在数组内部

Question

我想使用对象内部的图像路径作为值。此对象也在数组内部。但这张照片并没有出现。有人能解释一下原因吗？我的代码：

const Data =[
{
imgsrc:"{require('../src/img/2.jpg')}",
title:'this is me',
sname:'Dark',
link:'https://www.google.com'
},
{
imgsrc:"{require('../src/img/1.jpg')}",
title:'this is me',
sname:'Dark',
link:'https://www.google.com'
}
];
export default Data;

Answer 1

因为这是字符串，不是正确的导入语句？Webpack或您正在使用的任何工具都无法找到此导入并正确解释它们。

试试这样的东西：

const image1 = require('../src/img/1.jpg')
const image2 = require('../src/img/1.jpg')
const Data =[
{
imgsrc:image1,
title:'this is me',
sname:'Dark',
link:'https://www.google.com'
},
{
imgsrc:image2,
title:'this is me',
sname:'Dark',
link:'https://www.google.com'
}`enter code here`
];

Answer 2

您不能以建议的方式使用require。好吧，事实上，当然有一种方法可以让人知道它是如何工作的，但我强烈建议不要这样做

考虑这个选项：

const image2 = require('../src/img/2.jpg');
const Data =[
{
imgsrc:image2,
title:'this is me',
sname:'Dark',
link:'https://www.google.com'
},
];
export default Data;