Vue.js2.0中的变化(持续更新中)
最近自己在学习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中的变化(持续更新中)的更多相关文章
- AutoJS4.1.0实战教程 ---火热持续更新中
这个时代假货太多,虚假广告更是充斥着整个互联网.尤其是那个传奇的我都无语了.好几个明xing代言,问题是太假了……我好奇的是那么虚假怎么就没人管呢,XX部干嘛呢……另外互联网刷视频赚钱就是个炒作.几百 ...
- 31 ArcGIS中后缀一览表(持续更新中……)
- 【前端面试】Vue面试题总结(持续更新中)
Vue面试题总结(持续更新中) 题目参考链接 https://blog.csdn.net/weixin_45257157/article/details/106215158 由于已经有很多前辈深造VU ...
- vue项目常用方法封装,持续更新中。。。
vue项目中可以直接使用 1.常用工具类untils.js中 /* * 验证手机号是否合格 * true--说明合格 */ export function isPhone(phoneStr){ let ...
- 耗时近一个月,终于录完了VUE.JS2.0前端视频教程!
这次课录制的比较辛苦,圣诞节时原本已经快录制完成了,偶然的一次,播放了一下,感觉不满意,好几篇推倒重来,所以今天才结束. vue.js2.0是Vue.JS的最新版本,视频教程还不多,如果你看到了,学到 ...
- java视频教程 Java自学视频整理(持续更新中...)
视频教程,马士兵java视频教程,java视频 1.Java基础视频 <张孝祥JAVA视频教程>完整版[RMVB](东西网) 历经5年锤炼(史上最适合初学者入门的Java基础视频)(传智播 ...
- 《WCF技术剖析》博文系列汇总[持续更新中]
原文:<WCF技术剖析>博文系列汇总[持续更新中] 近半年以来,一直忙于我的第一本WCF专著<WCF技术剖析(卷1)>的写作,一直无暇管理自己的Blog.在<WCF技术剖 ...
- vue.js2.0+elementui ——> 后台管理系统
前言: 因为观察到vue.js的轻量以及实时更新数据的便捷性,于是新项目便决定使用vue.js2.0以及与之配套的elementui来完成.只是初次接触新框架,再使用过程中,遇见了各种各样“奇葩”的问 ...
- 前端深入之js篇丨Array数组操作从入门到成神Up Up Up,持续更新中
写在前面 随着前端深入的不断学习,发现数组这个数据结构在前端中有着相当大的存在感,由于我初学前端的时候并没有系统性的学习数组,所以我将通过这篇文章同你一起学习数组,希望我们能一起进步,学会熟练操作数组 ...
- 史上最全的spark面试题——持续更新中
史上最全的spark面试题——持续更新中 2018年09月09日 16:34:10 为了九亿少女的期待 阅读数 13696更多 分类专栏: Spark 面试题 版权声明:本文为博主原创文章,遵循C ...
随机推荐
- 社工数据搜索引擎搭建 - Build Social Engineer Evildata Search Engine
如何设计搭建一个社工库 从初起设计一个社工库,到现在的Beta,前前后后零零整整花了不下一个月的时间,林林总总记录下来,留给需要之人 泄露数据库格式不一,长相奇葩,因需将用户名.密码.邮箱.哈希等信息 ...
- PL/SQL客户端连接虚拟机(linux)下的oracle服务器配置
虚拟机上linux装了oracle数据库服务器,想通过windowspl/sql客户端连接到服务器上,虚拟机的网络连接方式我设置为host-only. 去oracle官方网站下载instant ...
- SAP中常用SM系列事务代码总结
SM01 锁定事物 SM02 系统信息 SM04 显示在线用户 SM12 删除,显示锁对象 SM13 看update request SM21 看下系统日志 SM30|SM31 维护table|vi ...
- Python学习笔记008_类_对象_继承_组合_类相关的BIF
# 对象 = 属性 + 方法>>> # Python中的类名约定以大写字母开始>>> # tt = Turtle() 这就是创建类实例的方法,其它语言用new ,它 ...
- editplus的设置
1, 下载editplus3软件并且进行安装, 我这里是 EditPlus_3.4.1.1123_XiaZaiBa 2, 进行相关设置: 工具-->参数设置-->常规--勾选 (把Edit ...
- MultipleOutputs新旧api
package MRNB_V4; import java.io.IOException; import java.util.Iterator; import org.apache.hadoop.con ...
- 开源API集成测试工具 Hitchhiker v0.1.3 - 参数化请求
Hitchhiker 是一款开源的 Restful Api 集成测试工具,你可以轻松部署到本地,和你的team成员一起管理Api. 详细介绍请看: http://www.cnblogs.com/bro ...
- Linux入门之常用命令(14) kill
Linux kill 命令使用详解 功能说明:删除执行中的程序或工作. 语 法:kill [-s <信息名称或编号>][程序] 或 kill [-l <信息编号>] 补充说明: ...
- 云计算-openstack基础构架以及服务方式详解
一:什么是openstack 是Rackspace(美国航天局)和NASA(一家公司)共同发起的开源项目,他是一系列软件项目的组合. 这些项目是松耦合的关系,可以进行独立的安装,启动和停止,只有在必要 ...
- 用ESP8266+android,制作自己的WIFI小车
整体思路ESP8266作为TCP服务器,,手机作为TCP客户端,自己使用Lua直接做到了芯片里面,省了单片机,,节约成本,其实本来就是个单片机(感觉Lua开发8266真的很好,甩AT指令好几条街,,而 ...