Einige Freunde sind der Meinung, dass Vue zu schnell aktualisiert wird, was dazu führt, dass das im Kurs vermittelte Wissen nicht mit der aktuellen Vue-Version übereinstimmt, und meldet daher hauptsächlich eine Zusammenfassung der Änderungen in Vue.js2.0. Ich hoffe, allen helfen zu können.
1. Der von $index in Vue erhaltene Indexwert wird hauptsächlich für Operationen an mehreren Elementen verwendet, z. B. werden mehrere li über v-for erstellt oder Für einige Li-Operationen müssen Sie den Indexwert verwenden.
<template> <p class="hello"> <h1>{{ msg }}</h1> <button v-on:click="reverse">点击</button> <input v-model="newtodo" v-on:keyup.enter="add"> <ul> <li v-for="(todo,index) in todos"> <span>{{todo.text}}</span> <button v-on:click="remove(index)">删除</button> </li> </ul> </p> </template> <script> export default { name: 'HelloWorld', data () { return { msg: 'Welcome to Your Vue.js App', todos: [ {text:'我是一开始就有的哦!'} ], newtodo: '' } }, methods: { reverse: function(){ this.msg = this.msg.split('').reverse().join('') }, add: function(){ var text = this.newtodo.trim(); if(text){ this.todos.push({text:text}); this.newtodo = '' } }, remove: function(index){ this.todos.splice(index,1) } } } </script>
Dies ist ein Fragment, das ich selbst erstellt habe und das sich auf die Verwendung konzentriert des Indexes.
Verwandte Empfehlungen:
Vue2.0 legt die gemeinsame Nutzung globaler Stilinstanzen fest
Vue2.0, ElementUI implementiert das Umblättern von Tabellenseiten
Wertübergabeproblem der VUE2.0-Komponente
Das obige ist der detaillierte Inhalt vonVue.js2.0 ändert die Zusammenfassungsfreigabe. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!