メソッドを使用して Vue.js に条件付きスタイルを追加するにはどうすればよいですか?
P粉327903045
P粉327903045 2024-03-21 20:53:17
0
1
430

親コンポーネントから渡されたプロパティ値に基づいて、子コンポーネントに条件付きスタイルを追加したいと考えています。

これは条件付きスタイルの実例です:

<li v-bind:class="[booleanValue ? 'stylingClassOne' : 'stylingClassTwo']"

ただし、これは、私のスタイルが単一の変数に基づいており、2 つの値 (true/false) のみを持つことができる場合にのみ機能します。

複数の値を取ることができる変数に基づいて条件付きスタイルを実装したいと考えています。親コンポーネントから子コンポーネント stylingDecider に文字列を渡すとします。値は stylingClassOnestylingClassTwostylingClassThree になります。

したがって、次のことを実行したいと思います。 <li v-bind:class="getStylingClass(stylingDecider)"> しかし、これは 機能しません 。スタイルを決定するメソッドが必要な理由は、その処理に基づいてクラスを返す他の処理が進行中であるため、単に <li v-bind:class= を使用することはできないためです。 「スタイリング決定者」

私は何を間違えたのでしょうか?アドバイスをお願いします、ありがとうございます。 Vue 3 と bootstrap-vue 3 を使用しています。

P粉327903045
P粉327903045

全員に返信(1)
P粉653045807

機能するコード スニペットを作成しました:

リーリー リーリー リーリー
いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート