Article From:https://segmentfault.com/q/1010000011137279
Question:

vueCan we dynamically bind a class and satisfy two conditions simultaneously? To achieve this effect

(It must be wrong to write. I would like to ask if there is such an operation.

Answer 0:

:class=”{obj: A&&B ? A : B}” Study on the basis of this style of writing

Answer 1:

staycomputedIsn’t it possible to write a method?

Answer 2:
html:
<div :class="{ className: allTrue}"></div>
Add a variable in data, isAllData () {Return {AllTrue:'default';IsDisabled:'';Time:'''}}Methods:{Fun () {This.allTrue=isDisabled& &! Time? True:false;}}

Answer 3:

I don’t know if I didn’t understand the title of the subject. A class was controlled by two conditions.

<template>
    <div id="loading">
        <img :class="{'trans_scale': isCreated && enabled}" :src="imgUrl" alt="The picture comes from "/>< /div>< /template>< script>Export default {Name:'loading',Props: {ImgUrl: String},Data () {Return {IsCreated: falSe,Enabled: true}},Created: function () {This.isCreated = truE;}}< /script>

I can do that.

Answer 4:

Methods himself to write a method to judge if not good?

Answer 5:

Your own way of writing is OK

:class="{'xxx': a && b}", 
:class="[a && b ? 'xxx' : '' ]"

Answer 6:

Using filter

Answer 7:

:classYou can use objects, arrays, and string forms.
:class=”{‘className’: A && B}”
:class=”[A && B ? ‘className’ : ”]”
:class=”A && b ? ‘className’ : ””

Similar Posts:

Leave a Reply

Your email address will not be published. Required fields are marked *