Импорт JSON с динамическими полями с помощью GraphQL и Gatsby

Question

Я пытаюсь импортировать файлы JSON, содержащие категории продуктов, с помощью gatsby-transformer-json , которые содержат несколько продуктов с полями, которые имеют динамические подполя в зависимости от категории, в которой они находятся. Существуют сотни различныхкатегории, поэтому я хотел бы сохранить эти подполя, как «атрибуты» динамическими.Они также могут меняться со временем.Клиентская логика справится с этим.

К сожалению, GraphQL только позволяет мне явно запрашивать поля, и запрос должен знать все подполя.

Это JSON:

{
    "name": "Car Hifi",
    "categorydesc": "This should be a very long text",
    "products": [{
            "name": "JVC KW-DB93BT",
            "attributes": {
                "Has USB": "JVC",
                "compatible formats": {},
                "Hands free": "true"
            },
            "advantages": {
                "0": "More bass",
                "1": "Less power consumption",
                "2": "Simple UI"
            }
        }
    ]
}

и запрос:

query MyQuery {
  dataJson {
    name
    categorydesc
    products {
      name
      attributes {
        // This should be dynamic
      }
    }
  }
}

Answer 1

Единственное решение, которое я могу придумать, - это изменить attributes так, чтобы вместо него он стал массивом:

// from this
{
  "attributes": {
    "Has USB": "JVC",
    "compatible formats": {},
    "Hands free": "true"
  }
}

// to this
{
  "attributes": [
    {"label": "Has USB", "value": "JVC" },
    {"label": "compatible formats", "value": {} },
    {"label": "Hands free", "value": true },
  ]
}

Тогда вы можете запросить его:

query {
  dataJson {
    products {
      name
      attributes {
        label
        value
      }
    }
  }
}

К сожалению gatsby-transformer-json не настолько гибок, я думаю, если вы хотите пойти по этому пути, лучше написать свой собственный исходный плагин (который не так сложен, как кажется), который преобразует поле attributes перед подачей данные к Гэтсби createNode.

Несколько релевантных ссылок из документов:

• https://www.gatsbyjs.org/docs/creating-a-source-plugin/
• https://www.gatsbyjs.org/docs/node-apis/