国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

javascript – Die dynamische v-bind:class, die Attribute durch Steuerung in der Rendering-Liste li von vue2.0 hinzufügt, wird nicht sofort wirksam
給我你的懷抱
給我你的懷抱 2017-05-19 10:13:11
0
2
727

Zum Beispielcode:
Schritt 1: Holen Sie sich ein Datenobjekt-Array vom Server: [obj, obj, obj],
Schritt 2: Fügen Sie jedem Unterobjekt ein Browser-Objekt obj hinzu:

    for(let i = 0; i<array.length; i++){
        array[i].myObj = false,
    }
    添加之后的結(jié)果是每一個數(shù)組子對象obj中的屬性里面就會多了一個自定義的瀏覽器對象屬性:myObj:false

Schritt 3: Binden Sie dieses Attribut an die HTML-Struktur, um die dynamische Klasse zu steuern

html:
  <ul>
      <li v-for='item in array' @click='changeBg(item)'>
          <span :class='{'change_bg':item.myObj}'>qwer</span>
      </li>
  </ul>
 js:
    methods: {
        changeBg(item){
           item.myObj = true 
        }
    }
css:
.change_bg
  background: red

Das Ergebnis ist: Das myobj-Attribut wurde bei jedem Klicken in true ge?ndert, aber die dynamische Klasse wird erst wirksam, wenn ul aktualisiert wird (bei der Aktualisierung werden die ul-Daten nicht erneut abgerufen).

給我你的懷抱
給我你的懷抱

Antworte allen(2)
我想大聲告訴你
array[i].myObj = false
改為
this.array.$set(i, {myObj: false})
Ty80

樓上正解。因為屬性是動態(tài)添加的,需要使用vue提供的set方法,使該屬性為ES5的訪問器屬性,即可追蹤變化。

Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage