最近自己在學習Vue.js,在看一些課程的時候可能Vue更新太塊了導致課程所講知識和現在Vue的版本不符,從而報錯,我會在以后的帖子持續更新Vue的變化與更新,大家也可以一起交流,共同監督學習!
1.關于Vue中$index獲取索引值已經取消,多用于多個元素的操作,像ul中的li,通過v-for來建立多個li,如果對于其中的某個或者一些li操作的話,需要使用到索引值,用法如下;
<template> <div 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> </div></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>這是我自己組建的一個片段,重點在于index的使用。
總結
以上所述是小編給大家介紹的Vue.js2.0中的變化,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對錯新站長站網站的支持!
新聞熱點
疑難解答
圖片精選