Netlify CMS で Gatsby を使用しており、ファイル コレクションにオプションのフィールドがいくつかあります。これに関する問題は、GraphQL を使用してこれらのフィールドを取得できないことです。空白のままにするとフィールドが存在しないためです。
たとえば、次のコレクション ファイルがあるとします。
label: "Primary Color",
name: "primary",
file: "data/palette.yaml",
widget: "object",
fields: [
{
label: "Light",
name: "light",
required: false,
widget: "string"
},
{
label: "Main",
name: "main",
required: false,
widget: "string"
},
{
label: "Dark",
name: "dark",
required: false,
widget: "string"
},
{
label: "Contrast Text",
name: "contrastText",
required: false,
widget: "string"
}
]
すべてのフィールドはオプションです。ユーザーが の値のみを入力するとしますmain
。これにより、データが次のように保存されます。
primary:
main: '#ff0000'
light
、dark
およびcontrastText
まったく保存されません-それらは単に完全に除外されます。
GraphQL でデータをクエリするときは、ユーザーが入力したオプション フィールドと空白のままになっているフィールドがわからないため、明らかにすべてのフィールドを確認する必要があります。これは、クエリが次のようになることを意味します。
query MyQuery {
paletteYaml {
primary {
light
main
dark
contrastText
}
}
}
ユーザーがmain
フィールドにのみ入力した上記の例を使用すると、上記のクエリは としてエラーをスローし、light
フィールドは存在しません。dark
contrastText
これには (フォルダー コレクション タイプではなく) ファイル コレクション タイプを使用しているため、既定値を設定できません。とにかくデフォルト値を設定できたとしても、GraphQL と Yaml は値として受け入れないため、問題ありません。最良の代替手段として、または空の文字列 ( )undefined
のみを受け入れることができます。null
""
null
すべてのフィールド値をまたはに設定して yaml ファイルを手動で保存しても""
、クエリ結果を別の JavaScript オブジェクトと深くマージしているため、追加の問題が発生するため、これは機能しません。
undefined
エラーをスローする代わりに、空白の (欠落している) フィールドごとに GraphQL が返されるようにするか、空白/欠落しているフィールドをまったく返さないようにする必要があります。
これは一般的な問題 (Netlify CMS でのオプション フィールドの処理) のように見えますが、それに関するドキュメントには何もありません。人々はこの問題をどのように処理しますか?