最近自己在学习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中的变化(持续更新中)的更多相关文章

  1. AutoJS4.1.0实战教程 ---火热持续更新中

    这个时代假货太多,虚假广告更是充斥着整个互联网.尤其是那个传奇的我都无语了.好几个明xing代言,问题是太假了……我好奇的是那么虚假怎么就没人管呢,XX部干嘛呢……另外互联网刷视频赚钱就是个炒作.几百 ...

  2. 31 ArcGIS中后缀一览表(持续更新中……)

  3. 【前端面试】Vue面试题总结(持续更新中)

    Vue面试题总结(持续更新中) 题目参考链接 https://blog.csdn.net/weixin_45257157/article/details/106215158 由于已经有很多前辈深造VU ...

  4. vue项目常用方法封装,持续更新中。。。

    vue项目中可以直接使用 1.常用工具类untils.js中 /* * 验证手机号是否合格 * true--说明合格 */ export function isPhone(phoneStr){ let ...

  5. 耗时近一个月,终于录完了VUE.JS2.0前端视频教程!

    这次课录制的比较辛苦,圣诞节时原本已经快录制完成了,偶然的一次,播放了一下,感觉不满意,好几篇推倒重来,所以今天才结束. vue.js2.0是Vue.JS的最新版本,视频教程还不多,如果你看到了,学到 ...

  6. java视频教程 Java自学视频整理(持续更新中...)

    视频教程,马士兵java视频教程,java视频 1.Java基础视频 <张孝祥JAVA视频教程>完整版[RMVB](东西网) 历经5年锤炼(史上最适合初学者入门的Java基础视频)(传智播 ...

  7. 《WCF技术剖析》博文系列汇总[持续更新中]

    原文:<WCF技术剖析>博文系列汇总[持续更新中] 近半年以来,一直忙于我的第一本WCF专著<WCF技术剖析(卷1)>的写作,一直无暇管理自己的Blog.在<WCF技术剖 ...

  8. vue.js2.0+elementui ——> 后台管理系统

    前言: 因为观察到vue.js的轻量以及实时更新数据的便捷性,于是新项目便决定使用vue.js2.0以及与之配套的elementui来完成.只是初次接触新框架,再使用过程中,遇见了各种各样“奇葩”的问 ...

  9. 前端深入之js篇丨Array数组操作从入门到成神Up Up Up,持续更新中

    写在前面 随着前端深入的不断学习,发现数组这个数据结构在前端中有着相当大的存在感,由于我初学前端的时候并没有系统性的学习数组,所以我将通过这篇文章同你一起学习数组,希望我们能一起进步,学会熟练操作数组 ...

  10. 史上最全的spark面试题——持续更新中

    史上最全的spark面试题——持续更新中 2018年09月09日 16:34:10 为了九亿少女的期待 阅读数 13696更多 分类专栏: Spark 面试题   版权声明:本文为博主原创文章,遵循C ...

随机推荐

  1. 201521123008<java程序设计>第三周实验总结

    1.本周学习总结 2.书面作业 1.代码阅读 public class Test1 { private int i = 1;//这行不能修改 private static int j = 2; pub ...

  2. 201521123092《java程序设计》第三周学习总结

    #1. 本章学习总结 你对于本章知识的学习总结 #2. 书面作业 **Q1.  代码阅读 public class Test1 { private int i = 1;//这行不能修改 private ...

  3. java课程设计--猜数字(团队博客)

    java课程设计--猜数字(团队博客) 1.团队名称以及团队成员介绍 团队名称:cz 团队成员:陈伟泽,詹昌锦 团队照片: 2.项目git地址 http://git.oschina.net/Devil ...

  4. mount挂载和交换分区swap

    目录 mount挂载 挂载方法 选项 查看设备 卸载命令 文件挂载配置文件fstab 交换文件与分区 swap优先级 三个工具free,df,du 扩展 移动介质 使用光盘 挂载USB设备 mount ...

  5. 如何快速生成企业Web应用

    随着互联网的发展,企业认识到"电子化"和"无纸化"办公是一种必然趋势,但是企业在信息化建设中经常望而却步,主要原因是高昂的建设成本与不可以预估的结果风险.另外软 ...

  6. mysql死锁+解决

    自己作死,navicat不恰当的操作导致了表死锁,操作如下: 给表新加字段:name 没有选择允许为空,但是有没有设置初始值,所以运行的结果就是数据库表里有了name不允许为空但是确实为空的记录: 然 ...

  7. 异常 SQLErrorCodes loaded: [DB2, Derby, H2, HSQL, Informix, MS-SQL, MySQL, Oracle, PostgreSQL, Sybase]

    使用Spring 的JDBCtemplate 调用数据库的时候 出现了如下的问题 SQLErrorCodes loaded: [DB2, Derby, H2, HSQL, Informix, MS-S ...

  8. 小知识点-ios跳过app store更新版本

    版本更新实现的思路 获取自身的版本号 获取AppStore的版本号 自身的版本号和AppStore的比较 弹窗提示所需数据的获取的方式 1.获取自身的版本号 2.AppStore的版本号 Wechat ...

  9. 在web中使用HTTPS

    背景 目前网上流行的是HTTP协议,HTTPS协议还在逐步推广的过程中. HTTP协议以明文发送内容,容易被攻击者窃听.HTTPS在HTTP的基础上加入了SSL协议,SSL依靠证书来验证服务器的身份[ ...

  10. 转换时间对象和字符串对象&添加时间

    /* *基本思路,将字符串时间转化为时间对象,通过毫秒数来加减时间,然后在转化为字符串输出 */ //转化字符时间yy-mm-dd hh:mm:ss 为时间对象   使用split进行字符串的分割,取 ...