为什么地图功能没有按预期工作？ ReactJS

Question

我在 .map 中有一个 return 函数。 现在，我设法返回的每个数据都期望我拥有的一组对象。

那么数据看起来如何（抱歉截图，很难复制粘贴到这里）：

所以在代码中我会像这样使用 bankname：

{a &&
   a.map((item) =>
     item.banka.bankname.map((its) => (
         <div className='container p-3 my-3 bg-dark text-white'>
            <h2>{its}</h2>
         </div>
      ))
)}

而且一切正常。现在，当我想在此容器内使用 eks,type 时出现问题（its 所在的位置）。现在我无法以任何方式让它显示 bankname, eks, type 3 次（foreach bankname, eks, type make individual container）。我一整天都在尝试各种解决方案：将 banka 放入数组，将 banka 的键放入对象等等。我总是将所有三个放入一个容器中，或者我得到当我映射 banka

的每个键时，它的 9 次

所以我希望我的代码看起来像：

{a &&
   a.map((item) =>
     item.banka.map((its) => (
         <div className='container p-3 my-3 bg-dark text-white'>
            <h2>{its.bankaname}</h2>
            <h3>{its.eks}</h3>
            <h3>{its.type}</h3>
         </div>
      ))
)}

但是当我使用它时我得到错误：item.banka.map 不是一个函数。

您还可以在 jsfiddle 上找到完整代码：https://jsfiddle.net/hwps4tjm/

有关如何管理此问题的任何想法？谢谢

Answer 1

{a &&
    a.map((item) =>
      item.banka.bankname.map((its, index) => (
     <div className='container p-3 my-3 bg-dark text-white'>
        <h2>{its}</h2>
        <h2>{item.banka.eks[index]}</h2>
        <h2>{item.banka.type[index]}</h2>
     </div>
  ))
)}