子內容與容器金鑰

元件組態中的許多組態內容都包括子內容。子內容是包含在另一個內容中的內容，通常只與父內容的某些組態相關。子內容有時為選用，有時則為必要。

舉例來說：「項目清單」元件可能包含一個搜尋方塊；將組態內容 enableSearch 設定為 true 即可啟用搜尋方塊。啟用搜尋方塊後，您可在搜尋方塊中包括提示文字。為了設定提示文字，有一個子內容 searchHintText 可用於採用字串輸入的 enableSearch。在此情況下，只有當 enableSearch 設定為 true 時，子內容 searchHintText 才相關。此子內容為選用；如果未設定，則不會在搜尋方塊中顯示提示文字。

以下是 enableSearch 內容的範例程式碼，供您參考：

{
"enableSearch":{
"additionalData":{
"itemListSearchDefinition":{
"searchHintText":{
"value":"Search the list"
}
}
},
"value":true
}

另一方面，無論父內容的組態為何，某些子內容都是相關的。例如，欲設定篩選項目清單時所依據的預設欄位，您可以使用 defaultSortFields 組態內容。無論該內容的配置方式為何，它都可以包含子內容 defaultSortDirection，其可讓您將預設排序方向設定為遞增或遞減順序。

有時子內容會比較複雜。它們的深度可能會多於兩層，也可能會針對內容的不同組態變更。

以下是更為複雜的範例：可透過將 layout 內容設定為 horizontal 或 vertical 來將「屬性」元件配置為垂直或水平顯示屬性。

當將 layout 設定為 horizontal 時，它會包括兩個必要子內容：maxHeight 與 maxWidth。每個子內容都採用整數輸入，並以像素為單位決定元件的高度與寬度。

當 layout 設定為 vertical 時，它會包括必要子內容 isMultiLine，其可決定使用者介面中的屬性是否換行。(請注意，當 layout 設定為 horizontal 時，屬性會自動換行。)當 isMultiLine 設定為 true 時，它具有必要子內容 maxHeight，當 isMultiLine 設定為 false 時，它具有必要子內容 maxWidth。在此情況下，子內容會根據設定的組態而變更。子內容也會變為兩個層深。

以下是 layout 內容的範例程式碼，供您參考：

如果 layout 設定為 horizontal：

{
"layout":{
"selectedKey":"horizontal",
"additionalData":{
"dimensionDefinition":{
"maxHeight":{
"version":"1.0.0",
"value":200
},
"maxWidth":{
"version":"1.0.0",
"value":300
}
}
},
"version":"1.0.0"
}
}

如果 layout 設定為 vertical，且 isMultiLine 設定為 true：

{
"layout":{
"selectedKey":"vertical",
"additionalData":{
"isMultilineDefinition":{
"isMultiLine":{
"additionalData":{
"dimensionDefinition":{
"maxHeight":{
"version":"1.0.0",
"value":200
}
}
},
"version":"1.0.0",
"value":true
}
}
},
"version":"1.0.0"
}
}

如果 layout 設定為 vertical，且 isMultiLine 設定為 false：

{
"layout":{
"selectedKey":"vertical",
"additionalData":{
"isMultilineDefinition":{
"isMultiLine":{
"additionalData":{
"dimensionDefinition":{
"maxWidth":{
"version":"1.0.0",
"value":300
}
}
},
"version":"1.0.0",
"value":false
}
}
},
"version":"1.0.0"
}
}

在 JSON 組態檔案中，具有至少一個子內容的任何內容都包含 additionalData 金鑰。additionalData 金鑰內還有另一個金鑰，稱為容器金鑰，其中包含子內容。

我們再次以 enableSearch 內容為例：

{
"enableSearch":{
"additionalData":{
"itemListSearchDefinition":{
"searchHintText":{
"value":"Search the list"
}
}
},
"value":true
}

頂層內容為 enableSearch，它包含 additionalData。additionalData 內是容器金鑰 itemListSearchDefinition，其中包含子內容 searchHintText。

內容通常只有一個容器金鑰，所有子內容都包含在其中。但是，當單一內容包含多個容器金鑰時除外，在此情況下，每個金鑰都包含一或多個子內容。