diff --git a/src/guide/components/props.md b/src/guide/components/props.md index 518601b9a..1b6bd774e 100644 --- a/src/guide/components/props.md +++ b/src/guide/components/props.md @@ -389,13 +389,18 @@ defineProps({ type: String, required: true }, - // デフォルト値を持つ数値 + // 必須だが null になる可能性がある文字列 propD: { + type: [String, null], + required: true + }, + // デフォルト値を持つ数値 + propE: { type: Number, default: 100 }, // デフォルト値を持つオブジェクト - propE: { + propF: { type: Object, // オブジェクトと配列のデフォルトは、ファクトリー関数を使って // 返す必要があります。ファクトリー関数は、コンポーネントが @@ -406,14 +411,14 @@ defineProps({ }, // カスタムのバリデーター関数 // 3.4 以降、全ての props が第 2 引数として渡されます - propF: { + propG: { validator(value, props) { // 値が以下の文字列のいずれかに一致する必要がある return ['success', 'warning', 'danger'].includes(value) } }, // デフォルト値を持つ関数 - propG: { + propH: { type: Function, // オブジェクトや配列のデフォルトと異なり、これは // ファクトリー関数ではなく、デフォルト値として機能する関数です @@ -444,13 +449,18 @@ export default { type: String, required: true }, - // デフォルト値を持つ数値 + // 必須だが null になる可能性がある文字列 propD: { + type: [String, null], + required: true + }, + // デフォルト値を持つ数値 + propE: { type: Number, default: 100 }, // デフォルト値を持つオブジェクト - propE: { + propF: { type: Object, // オブジェクトと配列のデフォルトは、ファクトリー関数を使って // 返す必要があります。ファクトリー関数は、コンポーネントが @@ -461,14 +471,14 @@ export default { }, // カスタムのバリデーター関数 // 3.4 以降、全ての props が第 2 引数として渡されます - propF: { + propG: { validator(value, props) { // 値が以下の文字列のいずれかに一致する必要がある return ['success', 'warning', 'danger'].includes(value) } }, // デフォルト値を持つ関数 - propG: { + propH: { type: Function, // オブジェクトや配列のデフォルトと異なり、これは // ファクトリー関数ではなく、デフォルト値として機能する関数です @@ -557,6 +567,39 @@ export default { Vue は `instanceof Person` を使って、`author` props の値が本当に `Person` クラスのインスタンスであるかどうかを検証しています。 +## null になる可能性がある型 + +もし型が必須だが null になる可能性がある場合、あなたは `null` を含む配列構文を使用することができます: + +
+ +```js +defineProps({ + id: { + type: [String, null], + required: true + } +}) +``` + +
+
+ +```js +export default { + props: { + id: { + type: [String, null], + required: true + } + } +} +``` + +
+ +もし配列構文を使用せずに `type` に `null` だけを指定する場合、任意の型を許可することに注意してください。 + ## 真偽値の型変換 {#boolean-casting} `Boolean` 型の props は、ネイティブの真偽値の属性が振る舞う様子を模倣するために、特殊な型変換の規則を持っています。次のような宣言を含む `` があるとします: