json，數組的循環案例
大部分小夥伴工作中都會遇見json跟數組結合使用，案例up一下
var data = {
‘2018’ : [
{
‘title‘ : ‘案例一‘，
‘name’ : ‘fanny1‘
},
{
‘title‘ : ‘案例一‘，
‘name’ : ‘fanny2‘
}
],
‘2017’ : [
{
‘title‘ : ‘案例二‘，
‘name’ : ‘fanny1‘
},
{
‘title‘ : ‘案例二‘，
‘name’ : ‘fanny2‘
}
]
}
一般從後臺接收的很大部分數據都是這樣的形式
1.json裏面的循環 ： for(var key in data) {}
有一種方法可以直接獲取key值 Object.keys(data)
如果要獲取單獨的key值 Object.keys(data)[0]
2.數組的循環就很多種，舉例一個
var arrayData = data[key];
arrayData.map((item,index)=>{
console.log(item) //這樣就獲取數組的每一個數據了
})
3.如果你的外層需要這些數據，我們來拼接
var shtml="";
for(var key in data) {
var reportData = data[key];
shtml1 += ‘<li>‘;
shtml1 += ‘<div class="menu_title"><span>‘ + key + ‘年</span></div>‘;
shtml1 += ‘<ul class="menu_content">‘;
reportData .map((item,index)=>{
shtml1 += ‘<li attr-href=‘+item.title+‘ attr-img=‘+item.name+‘>‘+item.title+‘</li>‘;
}
shtml1 += ‘</ul></li>‘;
}
然後在渲染進去
document.querySelector(".main").appendChild(shtml1 );
*註意問題
這裏面的key值如果是數字，默認是升序排列，需要自己排列一下
json，數組的循環案例