小程序开源代码_Vue.js2.0中的变化小结

Vue.js2.0中的变化小结       最近小编在学习vue.js ,发现里面有好多好玩的东东,今天小编给大家分享Vue.js2.0中的变化,小编会在日后给大家持续更新的,感兴趣的朋友参考下吧

最近自己在学习Vue.js,在看一些课程的时候可能Vue更新太块了导致课程所讲知识和现在Vue的版本不符,从而报错,我会在以后的帖子持续更新Vue的变化与更新,大家也可以一起交流,共同监督学习!

1.关于Vue中$index获取索引值已经取消,多用于多个元素的操作,像ul中的li,通过v-for来建立多个li,如果对于其中的某个或者一些li操作的话,需要使用到索引值,用法如下;

 template 
 div 
 h1 {{ msg }} /h1 
 button v-on:click="reverse" 点击 /button 
 input v-model="newtodo" v-on:keyup.enter="add" 
 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中的变化,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对凡科网站的支持!


相关阅读