时间戳

首页 > 解决方案 > 如何在不修改原始数据的情况下编辑 Gatsby GraphQL 数据

reactjs - 如何在不修改原始数据的情况下编辑 Gatsby GraphQL 数据

问题描述

我正在使用 Gatsby 构建一个站点并从 WordPress 获取数据。

我受不了了，Node所以我想清理数据。再次访问页面时会出现问题（没有浏览器刷新），它现在会引发Node未定义的错误。

老实说，盖茨比文档一团糟，所以我仍然不知道 graphql 部分是如何工作的。

在index文件中查询：

export const query = graphql`
    query {
        allWpMasina(limit: 6) {
            nodes {
                id
                atrumkarbas {
                    nodes {
                        name
                    }
                }
            }
        }
    }
`;

所有汽车都只有一个“atrumkarbas”，所以我只想为它分配名称，而不是atrumkarbas.node[0].name每次我想访问它时都写。

所以在索引页面中我添加了以下内容：

const IndexPage = ({ data: { allWpMasina } }) => {
    let cars = allWpMasina.nodes;
    cars.forEach((car) => {
        car.atrumkarbas = car.atrumkarbas.nodes[0].name;

如您所见，它摆脱了.nodes[0].name并且一切正常。但是当我重新访问该页面时：

Cannot read properties of undefined (reading '0')

我尝试添加let cars = allWpMasina.nodes.map()所以它每次都复制它而不修改它，data.allWpMasina但不知何故它仍然缓存它们并弄乱重新访问。

更改之前的控制台日志记录输出已经格式化的结果！如果我删除它，forEach它会返回到节点节点节点，但是当我重新添加它时，它现在与执行之前allWpMasina相同！carsforEach

Gatsby 如何处理 Graphql 数据？如何在不影响原始数据的情况下进行复制和修改？

标签： reactjswordpressgraphql

解决方案

推荐阅读