【前端】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文件的上传文件数 ...
随机推荐
- bzoj1222
奇怪的dp 思路清奇 dp[i][j]表示当前做完了i个任务,1机器花了j秒,2机器花费的最少时间,然后转移就行了. #include<bits/stdc++.h> using names ...
- ASP.NET Core MVC 2.x 全面教程_ASP.NET Core MVC 14. ASP.NET Core Identity 入门
默认的身份认证好授权系统 UserManager用来操作用户的类, Singi用来身份认证的 添加AccountController 先声明SignInManager和UserManager这两个服务 ...
- PTA 模拟,【放着一定要写哈哈哈哈哈】(据说用string哟)
实现一种简单原始的文件相似度计算,即以两文件的公共词汇占总词汇的比例来定义相似度.为简化问题,这里不考虑中文(因为分词太难了),只考虑长度不小于3.且不超过10的英文单词,长度超过10的只考虑前10个 ...
- python property的2种使用方法
一.property类 class Person(): def __init__(self, name): self.set_name(name) def get_name(self): return ...
- Java中JRE、JDK和JVM的区别
一.三者的基本概念: JRE(Java Development Kit):Java的运行环境: JDK(Java Runtime Enviroment):Java开发工具包: JVM(Java Vir ...
- UWP 页面跳转传值
如果涉及到页面跳转,一般用Frame这个控件来管理不同的页面. <Grid Name="RootGrid"> <Frame Name="RootFram ...
- bzoj1024 [SCOI2009]生日快乐【dfs】
传送门:http://www.lydsy.com/JudgeOnline/problem.php?id=1024 普通的深搜. #include <cstdio> #include < ...
- Codeforces 1107G(dp)
1.答案要取连续的区间疯狂暗示线段树. 2.外层枚举r,内层枚举l显然过于暴力. 3.考虑内层的优化.dp[i]:以第i位为结尾的答案(长度大于1的).dp[i] = max(第一种情况,第二种情况) ...
- Educational Codeforces Round 24 D
Alice and Bob got very bored during a long car trip so they decided to play a game. From the window ...
- Chef and Graph Queries CodeChef - GERALD07
https://vjudge.net/problem/CodeChef-GERALD07 可以用莫队+带撤销并查集做 错误记录: 1.调试时数组开小了,忘了改大就交了 2.88行和91行少了备份num ...