【前端】pid2children iview tree json
<script>
import inBody from '../inBody'
export default {
components:{
inBody
} ,data () {
return {
data2: [
{title: 'parent 1'}
,{title: 'parent 1'}
]
,pidData:[
{id:"1",pid:"0",title:"一级目录"}
,{id:"2",pid:"0",title:"又是一个一级目录"}
,{id:"3",pid:"1",title:"二级栏目"}
]
}
}
,methods:{
pid2children:function(){ let pidData2 = this.pidData //pidData就是pid数据
//pidData2 === this.pidData ? console.info("true") : console.info("false")
pidData2.forEach(el => {
delete el.children //delete 删除数组 数组长度不变 特别适合 索引用
}) let map = {}
pidData2.forEach(el => {
map[el.id] = el // 循环data拿到所有的id
}) let arr = []
pidData2.forEach(el => {
let parent = map[el.pid] // 拿到所有的pid,如果为真,和id进行对比,如果pid===id,就说明是id的子集
if (parent) {
(parent.children || (parent.children = [])).push(el)
} else { // 如果不是就是第一级,没有pid或者pid为0
arr.push(el)
console.log('arr', arr)
}
}) return arr;
}
}
,mounted:function(){
this.$nextTick(function () {
// Code that will run only after the
// entire view has been rendered
//this.getData2()
}) }
}
</script>
【前端】pid2children iview tree json的更多相关文章
- tree iview treeData json数据 添加 selected 数据 要进行vue.set 进行响应式添加
tree iview treeData json数据 添加 selected 数据 要进行vue.set 进行响应式添加
- IVIEW TREE问题总结
1. API得到的tree数组数据,在前端构造成iview tree格式,无法编辑或者无法再次选中的问题: 由于VUE不能检测到数据或对象的变动,官网文档有解释 由于 JavaScript 的限制,V ...
- Python web前端 08 字符串 数组 json
Python web前端 08 字符串 数组 json 一.string #string 字符串 #索引 下标 偏移量 ---从0开始 str[index]; #通过索引取字符串 可读不可写 str. ...
- 【整理】iview Tree数据格式问题,无限递归树处理数据
iview Tree数据格式问题,无限递归树处理数据 https://juejin.im/post/5b51a8a4e51d455d6825be20
- ajax使用json数组------前端往后台发送json数组及后台往前端发送json数组
1.引子 Json是跨语言数据交流的中间语言,它以键/值对的方式表示数据,这种简单明了的数据类型能被大部分编程语言理解.它也因此是前后端数据交流的主要方式和基础. 2.前端往后台传输json数据 第一 ...
- 利用Ajax把前端的数据封装成JSON格式发送到服务器端并写成XML格式在服务器的硬盘上
1.首先要在前端把要发送的东西(这里是一个实例化的car对象)都准备好,利用Ajax发送到服务器端,代码如下: <html xmlns="http://www.w3.org/1999/ ...
- iview tree 获取选中子节点的整条数据链
这样子获取到数据是,checked等于true的,获取不到他的父级,父级的父级 解决办法代码如下: //需要有一个唯一ID //==================================== ...
- 前端数据交互之json&ajax
1.json json是 JavaScript Object Notation 的首字母缩写,单词的意思是javascript对象表示法,这里说的json指的是类似于javascript对象的一种数据 ...
- php前端传过来的json数据丢失 (max_input_vars)
开发向我反馈,前端业务页面提交数据用js将要传输的数据用json dump后,发给服务器,服务器在loads后发现数据是不全的. 这个问题困扰开发人员和运维人员.首先调整php.ini文件的上传文件数 ...
随机推荐
- GetSafeHwnd()
CreateCompatibleBitmap The CreateCompatibleBitmap function creates a bitmap compatible with the devi ...
- Bid和Ask
一直很懵到底哪个是哪个,记吧,很快就又懵了.网上又坑,每一个解释清楚的.这次搞明白了记下来. 当然,这么逗比的取名法我也是醉了.直接加点东西,UserBuy,UserSell,BankBuy,Bank ...
- 洛谷 - P1337 - 平衡点/吊打XXX
一眼看过去以为是模拟退火/随机增量之类的.感觉先跑个凸包,然后在凸包内随机转移. 根据力臂长度*重量计算每个方向的分力?判断一个点比原来的点更平衡,是指他们的合力更接近0?每次判断要遍历一次,使用n的 ...
- Codeforces 702B【二分】
题意: 给一个a数组,输出有多少对相加是等于2^x的.1<=a[i]<=1e9,n<=1e5 思路: a[i]+a[j]=2^x 对于每个a[i],枚举x,然后二分查找a[j]; p ...
- 7天学完Java基础之5/7
接口 接口就是一种公共的规范标准 是一种引用数据类型 定义格式 public interface 接口名称{} java7 中接口可以包含常量,抽象方法:Java8 还可以额外包含默认方法,静态方法: ...
- Luogu P1613跑路【倍增】By cellur925
题目传送门 开始的思路:直接跑一遍最短路,得到最短路的那个值.然后把那个值进行一下二进制拆分,看能拆几次.(可能是受到了刚做过的题影响) ;i>=;i--) { <<i)>qw ...
- 9-26模拟赛 By cellur925
1.计数 (count.cpp/c/pas)时间限制:1s内存限制:256MB[问题描述]给出 m 个数 a[1],a[2],…,a[m]求 1~n 中有多少数不是 a[1],a[2],…,a[m]的 ...
- 关于ios7 以上版本 view被导航栏遮挡的问题 解决方案
self.edgesForExtendedLayout = UIRectEdgeNone; 如果导航栏是默认带磨砂透明效果的,使用了edgesForExtendedLayout可能会出现导航栏变不透明 ...
- jQuery中$.getJSON
$.getJSON $.getJSON()是专门为ajax获取json数据而设置的,并且支持跨域调用,其语法的格式为: $.getJSON( url, //请求URL [data], //传参,可选参 ...
- scanf()和scanf_s()
在最初的C语言中,原版的输入就是scanf("<格式化字符串>",<地址表>) ANSI C中没有scanf_s(),只有scanf(),scanf()在读 ...