VUE前端從后臺(tái)請(qǐng)求過(guò)來(lái)的數(shù)據(jù)進(jìn)行轉(zhuǎn)換數(shù)據(jù)結(jié)構(gòu)操作
我就廢話不多說(shuō)了,大家還是直接看代碼吧`
let label(){let _this = this;let _offset = (_this.pagination.currentPage - 1) * _this.pagination.pageSizelet params ={offset:_offset,//分頁(yè)偏移量limit:_limit,//分頁(yè)查詢數(shù)量}labelView(',params).then(res=>{_this.list = res.data.data_this.pagination.total = res.data.pagination.total;//轉(zhuǎn)換數(shù)據(jù)let treeDataArray = new Array();const element = _this.listlet obj={name:'',isExpand:true,children:new Array()}treeDataArray.push(obj);for(let dd1 = 0;dd1<_this.list.length;dd1++){const element = _this.list[dd];let obj1 ={root:true,isExpand:true,name:element[’model’],children:new Array()}obj.children.push(obj1);for(let dd2 = 0;dd2<element.label.length;dd2++){const element2 = element.label[dd2];let obj2 = {name:element[’label2’],isExpand:true,children:new Array()};obj1.children.push(obj2);for(let dd3 = 0;dd3<element2[’label3’].length;dd3++){const element3 = element2[’label3’][dd3];obj2.children.push({name:element3,})}}}_this.treeList = treeDataArray;
補(bǔ)充知識(shí):Vue中使用Map數(shù)據(jù)結(jié)構(gòu)的坑, 直接set 無(wú)法觸發(fā) 雙向數(shù)據(jù)綁定(解決方案)
1. 因?yàn)橄胴瀼豦s6的使用, 在項(xiàng)目中 多多使用 es6 的特性, 結(jié)果Map 的 set 方法去更新數(shù)據(jù), 視圖無(wú)法同步,
故而使用重新設(shè)置的方式達(dá)到目的, 類似
let obj = Object.assign({},{})
或者
let arr = [].concat[’a’]
let no = server_no.toString()let is_check = this.collated_data.get(no).is_checkthis.collated_data.get(no).is_check = !is_check// 使用Map數(shù)據(jù)結(jié)構(gòu)只能這樣更新this.collated_data = new Map(this.collated_data)
重新賦值, 而不是更改引用。
以上這篇VUE前端從后臺(tái)請(qǐng)求過(guò)來(lái)的數(shù)據(jù)進(jìn)行轉(zhuǎn)換數(shù)據(jù)結(jié)構(gòu)操作就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. python 如何在 Matplotlib 中繪制垂直線2. bootstrap select2 動(dòng)態(tài)從后臺(tái)Ajax動(dòng)態(tài)獲取數(shù)據(jù)的代碼3. ASP常用日期格式化函數(shù) FormatDate()4. python中@contextmanager實(shí)例用法5. html中的form不提交(排除)某些input 原創(chuàng)6. CSS3中Transition屬性詳解以及示例分享7. js select支持手動(dòng)輸入功能實(shí)現(xiàn)代碼8. 如何通過(guò)python實(shí)現(xiàn)IOU計(jì)算代碼實(shí)例9. 開發(fā)效率翻倍的Web API使用技巧10. vue使用moment如何將時(shí)間戳轉(zhuǎn)為標(biāo)準(zhǔn)日期時(shí)間格式
