您的位置:首页 > 产品设计 > UI/UE

Vue.js根据列表某列值更新filter

2017-12-27 11:14 309 查看
<!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": "1", "name": "hh1" }, { "id": "2", "name": "hh2" }, { "id": "3", "name": "hh3" }];
var vm = null;
vm=new Vue({
el: "#matchList",
data: {
eventList: data
}

});

var eventNum = -1;
function refesh() {
data = [{ "id": "1", "name": "hh11" }];
//vm.eventList = data;
for (var i = 0; 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 > -1) {
console.log(eventNum);
vm.eventList[eventNum] = data[i];
console.log(vm.eventList[0]);
}

}
//vm.eventList[0] = data[0];
vm.$set(vm.eventList, 0, vm.eventList[0]);
}

</script>

</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: