Vue 3 コンポジション API: 値が False の場合でも、Props と v-if をレンダリングします。-PHP中国語ネットワークQ&A

に質問

Vue 3 コンポジション API: 値が False の場合でも、Props と v-if をレンダリングします。

P粉786432579 2023-11-05 14:48:16 表示＃ヒョウジ＃ 970

Vue.js

ここで、よくわからない問題に遭遇しました。 true または false に設定できる「active」という名前の prop が渡される子コンポーネントを含めます。「true」が渡された場合はコンポーネントの一部が表示され、「false」が渡された場合は表示されないという考えです。

私の理解では、次のようにプロップ名を使用できるはずです:

リーリー

問題は、上記のステートメントの v-if を true または false に直接設定すると、期待どおりに動作することです。これを小道具として渡すと、true か false に関係なく、常に表示されます。

有効 (何も表示されない):

リーリー

無効 (active の値に関係なく、div 内のコンテンツが表示されます):

リーリー＃＃＃どうしてこれなの？「active」の値を表示して確認し、値 false が渡されましたが、値が false であるにもかかわらずレンダリングされます。ここで何かが足りないのでしょうか？引用符を使用して、引用符なしで、 ref を使用してローカル値を渡し、それを使用してみました:

リーリー

これもうまくいきませんでした。

Your Answer

提出する

2 件の回答

エクスポートのデフォルトでは、

リーリー

コンポーネントテンプレートで、

リーリー

コンポーネントを使用する場合は、アクティブな要素を false にバインドします

リーリー

2023-11-06 10:51:02

提出する

これは、prop が親コンポーネントから渡された文字列であるためです (他の HTML 属性のデフォルトの動作と同じです)。 prop をブール値として渡すには、v-bind 構文または : 短縮表現を使用して、false が ## として解析されるようにする必要があります。 # JavaScript 式文字列の代わり: リーリー＃＃＃または＃＃＃リーリー

2023-11-06 09:00:36

提出する