首页 > 解决方案 > 将变量连接到数组映射方法

问题描述

我将一个变量传递给组件,如下所示,并将其映射到过滤数组

例子:

<TestSection name={Stackoverflow} />

在 Testsection 组件中

  const TestSection = ({ name }) => {
  const Data = useStaticQuery(
    graphql`
      query {
        Json {
          TEST {
            Stackoverflow {
              title
              description
            }
            Overflowstack {
              title
              description
            }
          }
        }
      }
    `
  );

  console.log(name) // this outputs Stackoverflow and this should be the input for map function
    return (
       {Data.Json.TEST.name.map((item, index) => (
        <div key={`test-${index}`}>
          <ul>
            <li>{item.title}</li>
            <li>{item.description}</li>
          </ul>
        </div>
       ))}
      );
    };

将名称传递给地图数组不起作用。目的是根据调用组件名称返回数组数据。如何将名称传递给地图数组?谢谢

标签: reactjsgraphqlgatsby

解决方案


推荐阅读