<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>智能社——http://www.zhinengshe.com</title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

    <meta name="apple-mobile-web-app-capable" content="yes">

    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <style>

    </style>

    <script src="vue.js"></script>

    <script>

    </script>

</head>

<body>

    <div id="box">

        <input type="button" value="添加" @click="add">

        <ul>

            <li v-for="val in arr">

                {{val}}

            </li>

        </ul>

    </div>

    <script>

        var vm=new Vue({

            data:{

                arr:['apple','pear','orange']

            },

            methods:{

                add:function(){//只能添加一次，有重复数据，

                    this.arr.push('tomato');

                }

            }

        }).$mount('#box');

    </script>

</body>

</html>
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>智能社——http://www.zhinengshe.com</title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

    <meta name="apple-mobile-web-app-capable" content="yes">

    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <style>

    </style>

    <script src="vue.js"></script>

    <script>

    </script>

</head>

<body>

    <div id="box">

        <input type="button" value="添加" @click="add">

        <ul>

            <li v-for="val in arr" track-by="$index"> <!-- 可以添加重复数据-->

                {{val}}

            </li>

        </ul>

    </div>

    <script>

        var vm=new Vue({

            data:{

                arr:['apple','pear','orange']

            },

            methods:{

                add:function(){

                    this.arr.push('tomato');

                }

            }

        }).$mount('#box');

    </script>

</body>

</html>

vue12 循环添加重复数据的更多相关文章

  1. 使用pymysql循环删除重复数据，并修改自增字段偏移值

    创建表: CREATE TABLE `info` ( `id` tinyint NOT NULL AUTO_INCREMENT, `name` varchar(20) NOT NULL, PRIMAR ...

  2. mongodb删除重复数据

    注:mongodb当前版本是3.4.3   插入六条数据:   查询存在重复的数据:   查询并循环删除重复数据:   删除语句解析: db.userInfo.aggregate([     {   ...

  3. DataGridView添加的数据最后一步无法生效的问题。

    在做项目时,需要使用到大量固定的参数,使用时只需修改一部分定值即可,所以就选用DataGridView控件进行循环添加,数据添加完成,一切正常,但是在修改数据时发现,每一次修改的数据的操作的最后一步总 ...

  4. vue教程2-05 v-for循环 重复数据无法添加问题 加track-by='索引'

    vue教程2-05 v-for循环 重复数据无法添加问题  加track-by='索引' 解决问题的代码示例: <!DOCTYPE html> <html lang="en ...

  5. vue.js之生命周期，防止闪烁，计算属性的使用，vue实例简单方法和循环重复数据

    摘要:今天是比较糟糕的一天没怎么学习,原因是学校的wifi连不上了~~.今天学习一下vue的生命周期,如何防止闪烁(也就是用户看得到花括号),计算属性的使用,vue实例简单方法,以及当有重复数据时如何 ...

  6. mysql删除多个重复数据，多个字段添加唯一性索引

    需求:删除station_id.ab_data_time.item_code_id.data_cycle.ab_value 字段重复的记录 #查询重复的数据 select b.id,b.station ...

  7. Oracle 数据库表中已有重复数据添加唯一键（唯一约束）

    Oracle 数据库表中已有重复数据添加唯一键(唯一约束) 问题描述 以 demo 举例,模拟真实场景. 表 TEST_TABLE 有如下字段和数据:id 是主键,code 没有设置键和索引 ID C ...

  8. List循环添加数据覆盖问题

    问题:java开发时,当我们使用List.add();循环添加数据,有时会出现前面添加的数据会被后面覆盖的现象.这是怎么回事尼? 会覆盖数据的代码 package com.boot.test; imp ...

  9. 关于iOS去除数组中重复数据的几种方法

    关于iOS去除数组中重复数据的几种方法   在工作工程中我们不必要会遇到,在数组中有重复数据的时候,如何去除重复的数据呢? 第一种:利用NSDictionary的AllKeys(AllValues)方 ...

随机推荐

  1. [转载]vim常用命令总结

    内容出处https://www.jianshu.com/p/a8ab13cff1ea 如有侵权请告知 移动.跳转 h.j.k.l:分别对应左.下.上.右.按键盘分布,从左到右,逆时针. w:移动到下一 ...

  2. Tarjan专题

    前排Orz tarjan tarjan算法在图的连通性方面有非常多的应用,dfn和low数组真是奥妙重重(并没有很搞懂反正背就完事了) 有向图强连通分量 #include<iostream> ...

  3. MFC基础知识

    1.句柄:具有内存后,系统返回的标识符 2.消息:相当于事件,例如鼠标点击就是一个消息 3.消息队列:就是将事件按照时间的先后顺序在一个队列中 4.消息处理机制:首先操作系统拿到消息,然后将消息放到消 ...

  4. POJ-3159 Candies 最短路应用（差分约束）

    题目链接:https://cn.vjudge.net/problem/POJ-3159 题意 给出一组不等式 求第一个变量和最后一个变量可能的最大差值 数据保证有解 思路 一个不等式a-b<=c ...

  5. 一线 | 中国联通宣布首批5G手机到位

    腾讯<一线> 作者郭晓峰 据中国联通相关人士今日透露,中国联通用于 5G 友好体验的首批合作 5G 手机全部到位.有 12 个品牌共 15 款 5G 手机及 5G CPE,包括.华为. O ...

  6. docker 下修改 mysql sql_mode和配置文件

    原文:docker 下修改 mysql sql_mode和配置文件 打开PowerShell 首先创建mysql容器,这里我们指定使用mysql5.7的版本 docker run -d -p 3306 ...

  7. 【BZOJ 1083】 [SCOI2005]繁忙的都市

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 很明显的最小生成树了. 输出最后选的那条边就好了. [代码] #include <bits/stdc++.h> usin ...

  8. MarkDown 图片大小问题

    本系列文章由 @YhL_Leo 出品,转载请注明出处. 文章链接: http://blog.csdn.net/yhl_leo/article/details/50099843 MarkDown里显示图 ...

  9. POJ 2442 Sequence(堆的使用练习）

    题目地址:id=2442">POJ 2442 真心没想到这题的思路. .原来是从第一行逐步向下加,每次都仅仅保存前n小的数.顺便练习了下堆.. 只是感觉堆的这样的使用方法用的不太多啊. ...

  10. 51nod-1296: 有限制的排列

    [传送门:51nod-1296] 简要题意: 有一个集合,集合中的数为1到n 给出a限制条件,a[i]表示第a[i]位置的数要比相邻位置的数要小 给出b限制条件,b[i]表示第b[i]位置的数要比相邻 ...