首页 前端知识 实现json的分页功能

实现json的分页功能

2024-04-29 11:04:04 前端知识 前端哥 307 237 我要收藏

json基本语法

JSON 语法是 JavaScript 对象表示语法的子集。

  • 数据在名称/值对中
  • 数据由逗号 , 分隔
  • 使用斜杆 \ 来转义字符
  • 大括号 {} 保存对象
  • 中括号 [] 保存数组,数组可以包含多个对象

 

一、分页功能

建立一个函数

// json分页
function pagination(page,number,Json_data){//获取分页数据 page为页number为要获取的数量 Json_data为数据总数
	let counts=Json_data.length//获取数据总数
	let start=(page-1)*number//获取开始值
	let end=(page)*number//获取结束值、
	let data=[]
	if(start>counts){//如果开始值大于总值就会返回空数组
		return false
	}
	if(end>counts){//如果结束值比总值大就把结束值设为总值
		end=counts
	}
	for(let i=start;i<end;i  ){//存入数据
		data.push(Json_data[i])
	}
	return data//返回数据
}

注:这里的end变量里的page为什么没有-1,是因为后面的for循环

二、使用

结合上面的带代码做我们刚才GIF图片的案列

js代码

//json数据
var luntan_json = [
    {
        "title":"关于变更第十六届中国电子信息年会举办时间、地点的通知",
        "time":"2022-10-18",
        "img":"news1.jpg",
        "desc":"各有关单位和个人:中国电子信息年会(以下称电子年会)是我国电子信息领域促进科技交流和产业发展的重要会议,主要围绕国家战略和科技前沿"
    },
	{"title":"关于第十六届中国电子信息年会延期举办的通知","time":"2022-08-09","img":"news2.jpg","desc":"关于第十六届中国电子信息年会延期举办的通知"
	},
	{
转载请注明出处或者链接地址:https://www.qianduange.cn//article/6170.html
标签
评论
发布的文章

@JsonCreator和@JsonValue

2024-05-05 22:05:05

Python 字符串转换为 JSON

2024-05-05 22:05:00

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!