本人正在开始学习Vue,每天写写基础的记录,希望对大家有帮助,如有错误还望指出,我也是一个小白,也希望大家能一起进步

v-for指令的使用:

1.循环普通数组

item in list 中的item是自己个想写什么名写什么名

另一种写法  i 表示索引值

2.循环对象数组

3.循环普通对象

4.迭代数字

注意事项:

key为number或者String

不加key,在使用数组的unshift方法时会出现以下的bug

ps:试了一下,加key,如果集合本来存在多个重复的item.id是不影响的,如果在输入的时候重复输入相同id,而又选中了刚输入的id会受影响,如果间接输入重复id则不受影响(我也不知道为啥会这样子,嫌麻烦就弄唯一key属性吧)

vue中v-for的使用的更多相关文章

  1. vue中的vue-cli

    在前面的学习过程中我相信你们已经对vue有了一定的了解,现在我们来看一下vue中的vue-cli. 学习这个我们首先需要的是node环境的,如果你的网络环境慢的话建议安装淘宝镜像,在cmd中输入 np ...

  2. Vue学习笔记七：Vue中的样式

    目录 两种样式 class样式 内联样式 两种样式 Vue中使用样式方式有两种,一种是class样式,一种是内联样式也就是style class样式 class样式使用的方式有5种,HTML如下 &l ...

  3. vue 中 直接操作 cookie 及 如何使用工具 js-cookie

    转载:https://www.cnblogs.com/xiangsj/p/9030648.html vue 中直接操作 cookie 以下3种操作方式 set: function (name, val ...

  4. vue中动态添加div

    知识点:vue中动态添加div节点,点击添加,动态生成div,点击删除,删除对应的div,其中数组的长度是动态改变的,如在from表单中应用,直接在提交方法中,获得list,获取所填的元素即可 效果: ...

  5. vue中$watch源码阅读笔记

    项目中使用了vue,一直在比较computed和$watch的使用场景,今天周末抽时间看了下vue中$watch的源码部分,也查阅了一些别人的文章,暂时把自己的笔记记录于此,供以后查阅: 实现一个简单 ...

  6. 025——VUE中事件的基本使用与VUE中差异

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. 024——VUE中filter的使用

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. 023——VUE中数据排序sort() / 数据反转 reverse() 的使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. 022——VUE中remove()方法的使用：

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. 内置组件 && vue中强大的缓存机制之keep-alive

    vue中强大的缓存机制之keep-alive 最近在用vue做项目,在切换页面时发现切换回原来的页面无法保存原来的状态. 如A页面需要ajax请求数据,然后切换到B页面做某些事情,再切换回A页面时,A ...

随机推荐

  1. Crontab 执行时没有环境变量！

    Crontab 执行时没有环境变量! Crontab 执行时没有环境变量! Crontab 执行时没有环境变量! 重要的事情说三遍,浪费我半天时间去找问题!! 非系统默认工具,执行时候需要加全路径!!

  2. springIoC的理解01

    IOC将模块(对象)之间的依赖关系交由IOC容器管理,让应用开发对接口编程,而不是对类编程.依赖反转:每个对象都需要与其合作的对象(也就是依赖的对象)的引用.未使用依赖反转的特性之前,是需要先创建一个 ...

  3. nginx内容

    nginx工作在7层:web server(静态内容 static contents)web reverse proxy(反向代理http,https,mail),cache(带缓存功能) proxy ...

  4. 一个socket数量的问题

    最近遇到一个问题,从业务上出现ftp异常: ftp .**.**.** ftp: connect: Cannot assign requested address 这台服务器上的socket统计如下: ...

  5. base64转码，解码方法

    function Base64() { // private property _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqr ...

  6. vlookup 公式使用及常见问题

    该函数的语法规则如下: VLOOKUP(lookup_value,table_array,col_index_num,range_lookup) 参数 简单说明 输入数据类型 lookup_value ...

  7. 将ipad作为电脑拓展屏或分屏的简单方法

    用Ipad实现电脑分屏的方法是挺简单的,但鉴于部分小白找不到合适的门路,在此重新分享一下. 需要的装备:  ipad   电脑   数据连接线 方法:某宝上搜索 duet display ,只需1元左 ...

  8. Python来袭，教你用Neo4j构建“复联4”人物关系图谱！

    来源商业新知网,原标题:Python来袭,教你用Neo4j构建“复联4”人物关系图谱!没有剧透! 复仇者联盟 之绝对不剧透 漫威英雄们为了不让自己剧透也是使出了浑身解数.在洛杉矶全球首映礼上记者费尽心 ...

  9. html注册栏网页练习代码

    html body>     <form action="#" method="get">         <div>       ...

  10. Nginx入门基础（一）

    Nginx介绍 Nginx 是一个高性能的 HTTP 和反向代理服务器,也是一个 IMAP/POP3/SMTP服务器. 官方测试Nginx能够支撑5万并发链接,并且cpu.内存等资源消耗却非常低,运行 ...