本人正在开始学习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. 为什么你需要少看垃圾博客以及如何在Python里精确地四舍五入

    今天又有一个Python初学者被中文技术博客中的垃圾文章给误导了. 这位初学者的问题是: 在Python中,如何精确地进行浮点数的四舍五入,保留两位小数? 如果你在Google或者百度上搜索,你会发现 ...

  2. 时效性：NABCD分析结果

    N:失物招领,表白墙,二手跳骚群,里面的信息都没有真正的利用起来,好多有用的信息,全部被覆盖,同时,也有好多信息,使用户不想看到的,时效性,是个重大的问题. 例如:暑假放假,我背着书包拿着行李,等候火 ...

  3. go语言问题集锦

    ==============================================beego框架=========================================== 1.使 ...

  4. 系统设计与架构笔记:ETL工具开发和设计的建议

    最近项目组里想做一个ETL数据抽取工具,这是一个研发项目,但是感觉公司并不是特别重视,不重视不是代表它不重要,而是可能不会对这个项目要求太高,能满足我们公司的小需求就行,想从这个项目里衍生出更多的东西 ...

  5. ssh 使用技巧

    参考:https://deepzz.com/post/how-to-setup-ssh-config.html SSH Config 那些你所知道和不知道的事 预览目录 配置项说明 相关技巧 管理多组 ...

  6. pyqt5 -—-布局管理

    绝对布局 例如: 我们使用move()方法定位了每一个元素,使用x.y坐标.x.y坐标的原点是程序的左上角. lbl1 = QLabel('Zetcode', self) lbl1.move(15, ...

  7. Angular开发环境构筑

    今天按照下面的顺序构筑了Angular的开发环境.很简单. -- 系统:win7, 64位 1.安装Note 从<https://nodejs.org/ja/>下载安装文件,安装. Not ...

  8. Windows下nginx下安装amqp

    1.复制php_amqp.dll 到php/ext/ 2.复制rabbitmq.4.dll 到php/3.复制rabbitmq.4.dll 到windows/system32/ (如32位) ,64位 ...

  9. Tex和LaTeX认识

    TeX (文本排版系统) 利用TeX可以很容易地生成高质量的dvi文件,打印输出.特别是在处理复杂的数学公式时.利用诸如是LaTeX等终端软件,TeX就能够排版出精美的文本. LaTeX LaTeX( ...

  10. react-redux的使用

    在react-redux 框架中,给我提供了两个常用的API来配合Redux框架的使用,其实在我们的实际项目开发中,我们完全可以不用react-redux框架,但是如果使用此框架,就如虎添翼了. 我们 ...