<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script src="../Scripts/jquery-1.10.2.min.js"></script> </head>
<body> <div id="matchList" >
<input type="button" value="刷新" onclick="refesh()" />
<div v-for="(item,index) in eventList":id="item.id"> {{item.name}} </div> </div> <script src="https://cdn.bootcss.com/vue/2.4.2/vue.min.js"></script>
<script type="text/javascript">
var data = [{ "id": "", "name": "hh1" }, { "id": "", "name": "hh2" }, { "id": "", "name": "hh3" }];
var vm = null;
vm=new Vue({
el: "#matchList",
data: {
eventList: data
} }); var eventNum = -;
function refesh() {
data = [{ "id": "", "name": "hh11" }];
//vm.eventList = data;
for (var i = ; i < data.length; i++) {
var name = data[i].name;
var id = data[i].id;
var item = $(vm.eventList).filter(function (index, item) { if (item.id == id) { eventNum = index; } }); if (eventNum > -) {
console.log(eventNum);
vm.eventList[eventNum] = data[i];
console.log(vm.eventList[]);
} }
//vm.eventList[0] = data[0];
vm.$set(vm.eventList, , vm.eventList[]);
} </script> </body>
</html>

Vue.js根据列表某列值更新filter的更多相关文章

  1. Vue.js的列表数据的同步更新方法

    这次给大家带来Vue.js的列表数据的同步更新方法,Vue.js列表数据同步更新方法的注意事项有哪些,下面就是实战案例,一起来看一下. 数组的 push(),pop(),shift(),unshift ...

  2. vue.js 同级组件之间的值传递方法(uni-app通用)

    vue.js 兄弟组件之间的值传递方法 https://blog.csdn.net/jingtian678/article/details/81634149

  3. 关于vue.js中列表渲染练习

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

  4. 使用Vue.js实现列表选中效果

     实际项目中,我们会遇到很多类似的需求,一个列表,需要点击其中一条高亮显示.熟悉JQuery的同学说这个太简单了.可以给这个选中的element设置一个active的class.配合Css样式,让ac ...

  5. vue.js对列表进行编辑未保存随时变更

    1.不要建立在同一vm对象下 2.使用深拷贝$.extend(true, vm.model, obj); 3.开新标签页

  6. vue.js循环for(列表渲染)详解

    vue.js循环for(列表渲染)详解 一.总结 一句话总结: v-for <ul id="example-1"> <li v-for="item in ...

  7. 从零开始学习Vue.js,学习笔记

    一.为什么学习vue.js methods 只有纯粹的数据逻辑,而不是去处理 DOM 事件细节. vue.js兼具angular.js和react的优点,并且剔除了他们的缺点 官网:http://cn ...

  8. Vue.js安装使用教程

    一.说明 上大学前,请的都是前端JavaScript.后端ASP/PHP/JSP.前后端代码混杂:上大学时,请的都是前端Jquery.后端SSH.前后端代码分离通过模板关联:大学出来后,请的都是前端三 ...

  9. Vue.js快速介绍-超级马里奥像素艺术

    原文出处:Quick Introduction to Vue.js - Super Mario Pixel Art ::代码我已经归纳在github上:[vue2-pixel-art]::::__查看 ...

随机推荐

  1. 在 .NET 中,扫描局域网服务的实现

    在最近负责的项目中,需要实现这样一个需求:在客户端程序中,扫描当前机器所在网段中的所有机器上是否有某服务启动,并把所有已经启动服务的机器列出来,供用户选择,连接哪个服务.注意:这里所说的服务事实上就是 ...

  2. CSS position: absolute、relative定位问题详解

    CSS2.0 HandBook上的解释:  设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位,而不考虑它周围内容的布局.假如其他具有不同 z-index 属性的对象已经占据了给定的 ...

  3. bzoj:1699;poj 3264: [Usaco2007 Jan]Balanced Lineup排队

    Description 每天,农夫 John 的N(1 <= N <= 50,000)头牛总是按同一序列排队. 有一天, John 决定让一些牛们玩一场飞盘比赛. 他准备找一群在对列中为置 ...

  4. [51nod1684]子集价值

    lyk最近在研究位运算. 它发现除了xor,or,and外还有很多运算. 它新定义了一种运算符"#". 具体地,可以由4个参数来表示. ai,j表示 i#j. 其中i,j与a的值均 ...

  5. [HDU3247]Resource Archiver

    AC自动机+状压DP 首先对所有串建AC自动机,然后对于每个资源串,算出从串末走到其他资源串末所需的距离(中途避开非法点) 也就是算出两两间的距离...然后就变成旅行商问题了. 计算距离的时候要考虑一 ...

  6. CF 610E. Alphabet Permutations

    题目:http://codeforces.com/problemset/problem/610/E 如果存在c1,c2在原串相邻且在询问串中c1在c2前面的话,把它们在原串出现次数加起来记作sum,那 ...

  7. BC#65T4 ZYB's Tree

    题目:http://acm.hdu.edu.cn/showproblem.php?pid=5593 点分治被卡了TAT... 正解是dp,可以按层数考虑dp,先预处理跑一边dfs得到子树各层数点数大小 ...

  8. 2017ICPC/广西邀请赛1001(水)HDU6181

    A Math Problem Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)To ...

  9. Npm vs Yarn 之备忘大全

    有则笑话,如此讲到:"老丈人爱吃核桃,昨天买了二斤陪妻子送去,老丈人年轻时练过武,用手一拍核桃就碎了,笑着对我说:你还用锤子,你看我用手就成.我嘴一抽,来了句:人和动物最大的区别就是人会使用 ...

  10. HAUTOJ 1283 YK的书架

    题目描述     YK新买了2n+1本相同的书,准备放在家里的3层书架上(每一层放书的数量>=0且<=n).不过YK摆放他的书有些特殊的要求,即任意两层摆放的书的数目之和,严格大于另一层的 ...