Boolean のプロパティ

標準 HTML 要素の Boolean 属性は、要素に追加することにより、true に設定されます。この属性は、指定しない場合、デフォルト値は false になります。したがって、属性のデフォルト値は常に false となります。Lightning Web コンポーネントでは、Boolean のプロパティに対して同じ原理が使用されます。

Boolean の公開プロパティのデフォルト値は常に false に設定します。bool.js ファイルでデフォルト値を true に設定すると、マークアップで値を静的に false に切り替える方法はありません。

HTML ファイルは次のようになります。

親コンポーネントには、show 属性が <c-bool> に追加されていないためにデフォルト値の false を表示する c-bool があります。

マークアップで false と指定する唯一の方法は、Boolean 属性を省略することです。マークアップで show="false" に設定すると、true に評価されます。

show プロパティを true に設定するには、show 属性を空白の値でマークアップに追加します。このバージョンの c-parent は、show プロパティで true を表示します。

show の値は true ですが、setAttribute をコールして明示的に反映しない限り、表示される HTML には show 属性が反映されません。「HTML 属性への JavaScript プロパティの反映」を参照してください。

Boolean 属性の値が true になると、表示される HTML は <my-component my-attribute> になります。

値を動的に切り替えるには、動的に計算された値を親コンポーネントから渡します。次に例を示します。

JavaScript getter を parent.js で使用して {computedValue} の値を返します。

関連トピック