SoFunction
Updated on 2025-04-05

Summary of changes in Vue.js2.0

I have been studying recently. When I was watching some courses, Vue may be too much updated, which makes the knowledge taught in the course not consistent with the current version of Vue, and thus an error is reported. I will continue to update Vue's changes and updates in future posts. Everyone can also communicate together and supervise the learning together!

1. Regarding the $index acquisition index value in Vue, it has been cancelled, and is mostly used for operations of multiple elements. For example, li in ul, multiple lis are created through v-for. If one or some li operations are used, the index value needs to be used, the usage is as follows;

<template>
 <div class="hello">
  <h1>{{ msg }}</h1>
  <button v-on:click="reverse">Click</button>
  <input v-model="newtodo" v-on:="add">
  <ul>
   <li v-for="(todo,index) in todos">
    <span>{{}}</span>
    <button v-on:click="remove(index)">delete</button>
   </li>
  </ul>
 </div>
</template>
<script>
export default {
 name: 'HelloWorld',
 data () {
  return {
   msg: 'Welcome to Your  App',
   todos: [
    {text:'I've had it from the beginning!'}
   ],
   newtodo: ''
  }
 },
 methods: {
  reverse: function(){
    = ('').reverse().join('')
  },
  add: function(){
   var text = ();
   if(text){
    ({text:text});
     = ''
   }
  },
  remove: function(index){
   (index,1)
  }
 }
}
</script>

This is a fragment I formed myself, and the focus is on the use of index.

Summarize

The above is the changes in Vue.js 2.0 introduced to you by the editor. I hope it will be helpful to you. If you have any questions, please leave me a message and the editor will reply to you in time. Thank you very much for your support for my website!