uniappで遅延読み込みを実装する方法

ユニアプリで遅延読み込みを実装する方法: ライフサイクル関数 [onReachBottom()] を使用して、ページが一番下までスクロールするときに読み込み操作を実行できます。コードは [onReachBottom: function()] です。

#このチュートリアルの動作環境: Windows7 システム、uni-app2.5.1 バージョン、thinkpad t480 コンピューター。

推奨 (無料): uni-app 開発チュートリアル

Uniapp による遅延読み込みの実装方法:

ユニアプリでは、リクエストされたデータを遅延ロードする必要がある場合、

onReachBottom() ライフサイクル関数を使用してページを一番下までスクロールできます。ロード操作を実行します。

ここでの p は、読み込まれるたびに 1 ごとに指定されるページ番号パラメータです。

onLoad() {
// ajax请求
this.ajaxCode(this.per)
},
onReachBottom: function() {
// 下拉懒加载
++this.per;
uni.request({
url: 'https://www.zrzj.com/api/index/homePage',
method: 'get',
data: {
p: this.per
},
success: (res) => {
var next_data = res.data.result
// 加载新数组
this.products = this.products.concat(next_data)
}
})
},
methods: {
ajaxCode(per) {
uni.request({
url: 'https://www.zrzj.com/api/index/homePage',
method: 'get',
data: {
p: per
},
success: (res) => {
var _data = res.data.result
this.products = _data;
}
})
}
}

関連する無料学習の推奨事項:

プログラミング ビデオ

以上がuniappで遅延読み込みを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。