解析博客“路径”以检索特定图像

时间:2019-12-17 14:52:06

标签: reactjs next.js

我正在遍历帖子列表并进行渲染,每个帖子都有一个详细信息页面,我要在该页面上渲染图像。

每个博客的路径是domain.com/posts/file_name /

每个博客的路径在我的MDX文件中定义为:

export default withRouter(({ children, router }) => (
  <BlogPost path={router.pathname} meta={meta}>
    {children}
  </BlogPost>
))

该元数据具有以下内容:

export const meta = {
 title: 'Welcome111',
 image: './bg7.jpg'
}

在详细信息页面的主要功能中,我通过文件传递专家意见:

function BlogPost({ path, meta, children }) {

标题的显示方式如下,{meta.title}确实显示了正确的标题。

图像<img src={meta.image} />不起作用,因为它在domain.com/posts中而不是domain.com/posts/file_name中搜索图像。

因此它从 domain / posts / bg7.jpg 获取图像,而不是 domain / posts / post_title / bg7.jpg

问题是,如何在图像的“路径”上传递值,以便它从 domain / posts / file_name

中获取图像

编辑:

使用此解决方案,但是仍然无法正常工作,所以我做错了

<img src={path + meta.image}></img>

0 个答案:

没有答案