vue渲染多层数据用v-for
来源:互联网 发布:淘宝申请售后过期 编辑:程序博客网 时间:2024/05/24 01:47
new Vue({ el: '#someElement', data: { category: [ { name: 'cate0', items: [ { value: 'cate0 item0' } ] }, { name: 'cate1', items: [ { value: 'cate1 item0' } ] } ] }
})
不改变数据结构,循环输出绑定第三层value的标签,,这该怎么写呢?
直接上代码
<!DOCTYPE html><html><head> <meta charset="utf-8"></head><body> <div id="demo"> <div v-for="c in category"> {{c.name}} <input v-for="item in c.items" v-model="item.value" /> </div> <div v-for="item in items"> <input v-model="item.value" /> </div> <div v-for="item in category | get_items"> <input v-model="item.value" /> </div> {{category | json}} </div> <script src="http://cdn.bootcss.com/vue/1.0.17/vue.min.js"></script> <script> 'use strict'; new Vue({ el: '#demo', data: { category: [ { name: 'cate0', items: [ { value: 'cate0 item0' } ] }, { name: 'cate1', items: [ { value: 'cate1 item0' } ] } ] }, computed: { items() { return this.$eval('category | get_items') //var arr = [] //this.category.forEach(c => c.items.forEach(t => arr.push(t))) //return arr } }, filters: { get_items: function (category) { var arr = [] category.forEach(c => c.items.forEach(t => arr.push(t))) return arr } }, }) </script></body></html>
0 0
- vue渲染多层数据用v-for
- Vue用v-for重渲染
- Vue监听当数据发生改变v-for渲染完成
- VUE条件渲染(v-if v-show v-for)
- Vue.js中的列表渲染:v-for
- VUE指令-列表渲染v-for
- 有关vue v-for 多层循环嵌套获取 行数的
- 8-Vue指令之列表渲染 V-for
- 监听vue.js中v-for全部渲染完成
- Vue中v-for的数据分组
- Vue.js v-bind遇到的数据渲染问题
- vue.js中的列表渲染(循环渲染)(v-for)
- Vue v-if条件渲染
- vue利用v-for嵌套输出多层对象,分别输出到个表
- vue v-for v-if
- vue v-for 数据处理
- vue v-for详解
- vue v-for 嵌套
- MySQL通过binlog来恢复数据
- 重载不应归在多态的范畴内
- 网络分层
- Jmeter----正则表达式提取respones数据
- Python 异常
- vue渲染多层数据用v-for
- 关于一些nio的问题资料
- python3+PyQt5 数据库编程--增删改
- How R Searches and Finds Stuff
- 51单片机超声波测距数码管显示
- java并发包:重入锁与Condition条件
- JZOJ 【GDOI2017第三轮模拟day1】单旋
- Spring IOC的几种注入方法
- 启动Tensorboard