如何在 React/Next.js 中将 prop 传递给 img src require

Question

我目前正在使用 React 和 Next.js 和next-images来导入图像

我想传递数据并直接在我的 img src url 中接收它，如下所示：

<img src={require(`../src/image/${data}`)} />

但它似乎是反引号和模板字符串？ 在 img 标签的选项中似乎不起作用。 有什么方法可以直接接收数据到src url？

Answer 1

我认为您正在寻找的是动态导入语句。 检查有关import()语法的此链接。 例如，

import(`messages_${getLocale()}.js`)

在第 5 节（对 module() 的支持）中，您可以查看一些使其适用于您的代码的方法。