IT技术 - 如何在jsx中映射一个具有图像和文本信息的json字符串 - 吾爱随笔录

我有一个包含对象数组的 json 文件，其中：

[
    { 
      "id": 1,
      "title": "first title",
      "description":"first descript",
      "image":"/assets/Images/myimage-1.jpg"
    },
 { 
      "id": 2,
      "title": "second title",
      "description":"second descript",
      "image":"/assets/Images/second.jpg"
    },
   
  ]

我在 jsx 中有以下功能

export default function myfunc({task}) {
    return (
        <ul>
            {tasks.map(task => <div key={task.id} >{task.title}{task.description}</div> )} ; 
            {tasks.map(task => <img src={task.image} key={task.id}></img> )}  

        </ul>
    )
}

执行时首先解析文本内容，然后解析图像内容，由于需要 img 标签，我该如何使用地图一次性解析图像源和文本？同时能够为他们分配课程？

我在几年前发现了一个类似的问题，但那个问题也没有答案。从jsonreact动态映射图像路径

import images from "./assets"; // <----- imported const tasks = [ { id: 1, title: "first title", description: "first descript", image: "1.png" // <------- changed here }, { id: 2, title: "second title", description: "second descript", image: "2.png" // <------- changed here } ];