ミニプログラムページ間でデータを転送する方法

私は最近ミニ プログラム プロジェクトに取り組んでおり、ミニ プログラムのページ間で一部のデータを渡す必要があることが多いことがわかりました。私自身の理解と知識に基づいて、さまざまなデータ要件に応じていくつかの異なるデータ送信方法があると結論付けました。ここでは、簡単な紹介と概要を示します。

最初のタイプ: ページがジャンプするときに URL を渡す

wx.navigateTo と wx.redirectTo を使用する場合、いくつかの値を渡すことができます。データ URL に入れて取得し、新しいページが onLoad になったときに初期化します。

//pageA.js

// Navigate
wx.navigateTo({
  url: '../pageB/pageB?name=lin&gender=male',
})

// Redirect
wx.redirectTo({
  url: '../pageB/pageB?name=lin&gender=male',
})

// pageB.js
...
Page({
  onLoad: function(option){
    console.log(option.name + 'is' + option.gender);
    this.setData({
      option: option
    });
  }
})

注意すべき問題:

1. wx.navigateTo および wx.redirectTo を使用する場合、タブへのジャンプは許可されません。含まれるページ;
2. onLoad は 1 回だけ実行されます;

適用可能:
このメソッドは通常、少数のページ間の少量のデータ転送に適しています。たとえば、ページ B にはページ A からの 1 ～ 2 個のデータが必要です。

2 番目: グローバル変数を使用して転送する

app.js ファイル globalData でグローバル変数を定義します。古いページには、転送されるデータが保存されます。新しいページには転送されるデータが保存され、ページはグローバル変数を呼び出して、渡されたデータ値を取得します。

// app.js

App({
     // 全局变量
  globalData: {
    name: null
  }
})

//pageA.js
···
getApp().globalData.name = "lin";


//pageB.js
···
this.setData({
  userName: getApp().globalData.name
});

注意すべき問題:

1. 使用する場合は、getApp() を直接使用して、保存されている情報を取得します。

適用可能:
この方法は通常、ホームページにアクセスするとすぐに取得されるユーザー情報など、同じデータを取得して使用する必要がある複数のページまたはすべてのページに適しています。

#3 番目の方法: ローカル キャッシュを使用する

ミニ プログラムでローカル キャッシュを使用する

ストレージ古いページは転送されたデータをキャッシュに保存し、新しいページはそれを取得します。 API を呼び出してキャッシュ データを取得します。

//pageA.js
···
wx.setStorageSync('sessionId', res.sessionId);


//pageB.js
···
var sessionId = wx.getStorageSync('sessionId');

注意事項:

ストレージが保存されるたびに、キーに対応する元のコンテンツは上書きされます。
1. ユーザーがアプレットを積極的に削除した場合、またはストレージ容量の問題によりシステムによってクリアされた場合、ストレージ内のデータはクリアされます。
2. 1 つのキーに保存できる最大データ長は 1MB で、すべてのデータ保存の上限は 10MB です。

適用可能:

この方法は一般に、ログイン ステータスの保持などと同様、アプレットが終了して再起動した場合でも保持する必要があるデータに適しています。

推奨チュートリアル: 「

WeChat ミニ プログラム」

以上がミニプログラムページ間でデータを転送する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。