“ und „computed:{reverseDIV(){return this.items“. .umkehren() }}"."/> “ und „computed:{reverseDIV(){return this.items“. .umkehren() }}".">

Heim  >  Artikel  >  Web-Frontend  >  So kehren Sie ein Array in Vue um

So kehren Sie ein Array in Vue um

青灯夜游
青灯夜游Original
2022-01-10 16:07:054270Durchsuche

Vue kann die „v-for“-Anweisung und berechnete Eigenschaften verwenden, um das Array umzukehren, die Syntax „8231e44468e55002f20415c003f132c2“ und „computed:{reverseDIV(){return this. Elemente .reverse()}}".

So kehren Sie ein Array in Vue um

Die Betriebsumgebung dieses Tutorials: Windows 7-System, Vue-Version 2.9.6, DELL G3-Computer.

vue-Methode zum Umkehren des Arrays

Methode eins:

<template>
    <div>
        <div v-for="item in Array.prototype.reverse.call(items)">
            <li>{{item}}</li>
        </div>
    </div>
</template>
 
<script>
    export default {
        name: "List",
        data(){
            return{
                items:[1,2,3,4]
            }
        },
 
    }
</script>

Methode zwei (berechnetes Attribut):

<template>
    <div>
        <div v-for="item in reverseDIV">
            <li>{{item}}</li>
        </div>
    </div>
</template>
 
<script>
    export default {
        name: "List",
        data() {
            return {
                items: [1, 2, 3, 4]
            }
        },
        computed: {
            reverseDIV() {
                return this.items.reverse()
            }
        }
    }
</script>

Beschreibung: Berechnetes Attribut

Typ: { [Schlüssel: Zeichenfolge] : Funktion |. { get: Function, set: Function } }

Details:

Berechnete Eigenschaften werden in Vue-Instanzen gemischt. Der This-Kontext aller Getter und Setter ist automatisch an die Vue-Instanz gebunden.

Beachten Sie, dass, wenn Sie eine Pfeilfunktion für eine berechnete Eigenschaft verwenden, diese nicht auf die Instanz der Komponente zeigt, Sie aber dennoch auf deren Instanz als ersten Parameter der Funktion zugreifen können.

computed: {
  aDouble: vm => vm.a * 2
}

Die Ergebnisse der berechneten Eigenschaften werden zwischengespeichert und nicht neu berechnet, es sei denn, die abhängigen Reaktionseigenschaften ändern sich. Beachten Sie, dass die berechnete Eigenschaft nicht aktualisiert wird, wenn eine Abhängigkeit (z. B. eine nicht reaktive Eigenschaft) außerhalb des Gültigkeitsbereichs der Instanz liegt.

Hauptsächlich eine Reihe von Vorgängen, die wir durchführen, ohne die Quelldaten zu verschmutzen

[Verwandte Empfehlungen: vue.js-Tutorial]

Das obige ist der detaillierte Inhalt vonSo kehren Sie ein Array in Vue um. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn