Vue.js根据列表某列值更新filter
<!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的更多相关文章
- Vue.js的列表数据的同步更新方法
这次给大家带来Vue.js的列表数据的同步更新方法,Vue.js列表数据同步更新方法的注意事项有哪些,下面就是实战案例,一起来看一下. 数组的 push(),pop(),shift(),unshift ...
- vue.js 同级组件之间的值传递方法(uni-app通用)
vue.js 兄弟组件之间的值传递方法 https://blog.csdn.net/jingtian678/article/details/81634149
- 关于vue.js中列表渲染练习
html: <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8 ...
- 使用Vue.js实现列表选中效果
实际项目中,我们会遇到很多类似的需求,一个列表,需要点击其中一条高亮显示.熟悉JQuery的同学说这个太简单了.可以给这个选中的element设置一个active的class.配合Css样式,让ac ...
- vue.js对列表进行编辑未保存随时变更
1.不要建立在同一vm对象下 2.使用深拷贝$.extend(true, vm.model, obj); 3.开新标签页
- vue.js循环for(列表渲染)详解
vue.js循环for(列表渲染)详解 一.总结 一句话总结: v-for <ul id="example-1"> <li v-for="item in ...
- 从零开始学习Vue.js,学习笔记
一.为什么学习vue.js methods 只有纯粹的数据逻辑,而不是去处理 DOM 事件细节. vue.js兼具angular.js和react的优点,并且剔除了他们的缺点 官网:http://cn ...
- Vue.js安装使用教程
一.说明 上大学前,请的都是前端JavaScript.后端ASP/PHP/JSP.前后端代码混杂:上大学时,请的都是前端Jquery.后端SSH.前后端代码分离通过模板关联:大学出来后,请的都是前端三 ...
- Vue.js快速介绍-超级马里奥像素艺术
原文出处:Quick Introduction to Vue.js - Super Mario Pixel Art ::代码我已经归纳在github上:[vue2-pixel-art]::::__查看 ...
随机推荐
- 阿里云Centos 7.4 mssql-server
1.阿里云服务器控制台,开启1433端口(出入方向都要开).自从微软发布linux版本后,控制台常用端口下拉列表也增加了1433. 2.如果你没配置阿里云yum源,可参照配置一下.http://www ...
- SRM 20
本来T1想出给一堆数求异或最大值的,然后觉得太模板不好……就改成了现在这样(好像跟T2难度差不多了?不管辣 魔法弹 先把最大线性无关组求出来,就不会有重复的问题了.接下来单独考虑每个位,如果某个上所有 ...
- 【批处理学习笔记】第十四课:常用DOS命令(4)
系统管理at 安排在特定日期和时间运行命令和程序shutdown立即或定时关机或重启taskkill结束进程(WinXPHome版中无该命令)tasklist显示进程列表(Windows XP Hom ...
- Vijos P1786 质因数分解【暴力】
质因数分解 背景 NOIP2012普及组第一题 描述 已知正整数n是两个不同的质数的乘积试求出较大的那个质数. 格式 输入格式 输入只有一行包含一个正整数n. 输出格式 输出只有一行包含一个正整数p, ...
- [bzoj1587] [Usaco2009 Mar]Cleaning Up 打扫卫生
首先(看题解)可得...分成的任意一段中的不同颜色个数都<=根号n...不然的话直接分成n段会更优= = 然后就好做多了.. 先预处理出对于每头牛i,和它颜色相同的前一头和后一头牛的位置. 假设 ...
- Legal or Not(拓扑排序判环)
http://acm.hdu.edu.cn/showproblem.php?pid=3342 Legal or Not Time Limit: 2000/1000 MS (Java/Others) ...
- input[type=file]中使用ajaxSubmit来图片上传
今天在使用input[type=file]上传图片到服务器时,因为项目要求,并不是像常见的通过按钮来提交表单事件,而是图片上传后就自动执行表单提交事件,将上传的图片信息传给服务器. 刚开始我是这样执行 ...
- webpack的安装与使用
在安装 Webpack 前,你本地环境必须已安装nodejs. 可以使用npm安装,当然由于 npm 安装速度慢,也可以使用淘宝的镜像及其命令 cnpm,安装使用介绍参照:使用淘宝 NPM 镜像. 使 ...
- DTD约束
DTD约束 一,导入DTD方式 二,DTD语法 2)DTD语法 约束标签 <!ELEMENT 元素名称类别>或<!ELEMENT 元素名称(元素内容)> 类别: 空标签: ...
- Oracle database
//下面这个通常直选择TCP就好了 此处的全局数据库根据实际情况来确定,如果是第一次,要和第一次一致.(见上面的图中的全局数据库) //这个可以使 计算机名(计算机—>属性).也可以是ip地址 ...