从微信小程序文章列表进入详情页时，如何无加载打开详情页

Denis

发布于 2023-04-14 13:35:58

3500

发布于 2023-04-14 13:35:58

文章被收录于专栏：WordPress果酱

我在写「一个程序手册」的接口，在列表页的时候就把文章的所有数据都加载了，所以从文章列表进入详情页的时候，其实数据都已经有了，那么我们是否做到不请求接口直接打开详情页呢？

其实是可以的，微信小程序路由提供的 getCurrentPages() 函数，可以获取当前页面栈的实例。

这个函数提供的页面栈以数组形式按栈的顺序给出，第一个元素为首页，最后一个元素为当前页面，所以倒数第二个元素就是上一页，我们可以使用这个函数实现无加载打开详情页，具体代码：

const loadArticle = function (id) {
	let pages	= getCurrentPages()
	let count	= pages.length;
	let article	= null;

	if(count >=2 && (pages[count-2].data.is_list == true && pages[count-2].data.articles) ){
		let articles = pages[count-2].data.articles.filter(item => item.id == id);

		if(articles){
			article = articles[0];
		}
	}

	if(article){
		this.setData({
			article: article
		})
	}else{
		// 使用 API 远程加载文章详情
	}
}

体验Demo，请扫描一个程序手册，看看从列表页进入详情页是不是很快：

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

程序