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]::::__查看 ...
随机推荐
- html笔记2
html css的用法 <style type="text/css">代表我要使用css了 <html> <head> <style ty ...
- msfvenom向apk注入payload
首先安装apt-get install apkinjector 这个东西,msfvenom重新组装apk的时候会自动调用 msfvenom -x /路径/apk android/meterpreter ...
- [bzoj1692] [Usaco2007 Dec]队列变换 (hash||暴力)
本题同bzoj1640...双倍经验双倍幸福 虽然数据范围n=3w然而O(n²)毫无压力= = http://blog.csdn.net/xueyifan1993/article/details/77 ...
- 创建jedis对象
1.先在taotao-parent的pom.xml中复制 以下内容到rest的pom.xml中 <!-- Redis客户端 --> <dependency> <group ...
- Pycharm+django新建Python Web项目
这两天初学Python,首先是学习Python语法有PyCharm就可以运行Console程序了,因为是初学所以,尽量写的比较详细,包括参考的资料地址... 1.下载Python,并安装[本文版本 ...
- 安装win8+Ubuntu14.04双系统的经验总结
当时查资料,很多人推荐了easyBCD直接安装ubuntu,但是在我的笔记本上行不通.我的笔记本是Lenovo V480+win8正版系统.这是因为我的笔记本的引导结构是EFI,而不是MBR.我的方法 ...
- UE4 unreliable 同步问题
今天发现了一个问题,标记为unreliable的函数从来不执行,但是官方文档上的说明是只有在网络负载重时才不执行此类函数,哎哎哎.
- ThinkPHP5+小程序商城 网盘视频
ThinkPHP5+小程序商城 网盘视频 有需要联系我 QQ:1844912514
- dede从www跟目录迁移,网站空间
图集缩略图表名dede_uploads 字段url; 图集文章内部的图片表名dede_addonimages 字段imgurls 频道文章列表的图片 ...
- JavaSE笔记-泛型
定义带泛型的类 public class Cat<T> { //可以用T定义实例变量 private T name; //可以用T定义形参 //构造器没有<> public C ...