日々の開発で遭遇した様々な問題と、その解決策を閲覧しながら、日々の開発でよく使用するスキルや知識ポイントをまとめてみました。皆様のアドバイスを頂ければ幸いです。 1. 短寿命データ保存アプレットの起動から完全なシャットダウンまでのデータを app.js フォルダーに保存し、app.js を参照することをお勧めします。 const app = getApp(); Value は、API を要求するためのトークンや動的トークンなど、ミニプログラムのライフサイクルで頻繁に使用されるデータであると想定します。次に、この値をグローバル変数に割り当てることができます。実際、app.js の globalData は唯一のグローバル変数ではなく、独自のデータ セットを定義することができます。 アプリ({ 教育OS: トークン:'' }, ... }) app.jsのトークンに値を割り当てるのは非常に簡単です。ページがapp.jsを参照している限り app.eduOS.token = 値; このデータは、ミニプログラムの開始からバックグラウンドの完全な終了まで長期間存在し、必要に応じて変更できます。値はオブジェクトにすることができます。 2. 長期ライフサイクルまたはプライバシーデータの保存このタイプのデータの注目すべき特徴は、ミニプログラムが終了して再起動された後もデータがまだ存在すること、またはユーザーのプライバシー情報に関係しているが再利用する必要があることです。この場合、ローカル キャッシュを使用してこの問題を解決できます。 ローカル キャッシュのライフ サイクル: ミニ プログラムが使用開始されます -----> ミニ プログラムは使用リストから完全に削除されます。 アプレットでキャッシュを設定する方法: wx.setStorage({ キー: 'educookie'、 データ: { xh: that.data.xh、 パスワード: that.data.pwd } }) ミニプログラムがキャッシュを取得する方法: var that = this; wx.getStorage({ キー: 'educookie'、 成功: function(res) { that.setData({xh:res.data.xh,pwd:res.data.pwd}); }, }) たとえば、ユーザーのログイン情報は保存したいが、ユーザーの個人データは保存したくない場合は、この方法を使用できます。 または、時間に敏感でないデータの場合は、この方法で保存できます。 3. 動的情報または構成情報の保存ユーザーの設定情報を保存し、携帯電話を変更するときに設定の同期を迅速に完了します。 マーチャントのミニプログラムで推奨商品を変更したり、コンテンツを改訂したり、アクティビティを追加したりする必要がある場合、そのたびにミニプログラムを書き直して、ミニプログラムに再度レビューさせることは不可能です。 この目的のために、この情報はバックエンド サーバーに保存できます。 ミニプログラムのカルーセル ビルボードを例に挙げます。 { ad1:'imgurl1', ad2:'imgurl2', ad3:'imgurl3' } このデータをバックグラウンド サーバーに保存し、ページが更新されるたびにバックグラウンド データを要求してコンテンツを変更します。 wx.リクエスト({ url:'XXX', データ:{}、 成功(res){ that.setData({ 広告リスト:res.data }) } }) 同様の方法で、一部のデータの動的な制御やクラウド同期を実現できます。 4. ページ間のデータ転送1. URLパラメータ化 ページ間のデータ転送は一般的に単純です。このタイプのデータのライフ サイクルは 1 回限りで、使用後は削除されます。 wx.navigatorTo({ url:'../index/index?param1=value1¶m2=value2' }) //onLoad(オプション) を取得します{ console.log(options.param1);//値1 } ページ間でのパラメータの受け渡しを記述するには、Http リクエストの Get フォーム パラメータ受け渡しメソッドを参照してください。 2.保管形態の配送 送信するデータが多すぎる場合は、Map<key, Storge> を介して送信できます。詳細については、公式ドキュメントを参照してください。 wx.setStorage({ キー:'xxx', データ:mydata }) //wx.getStorgeSync('') を取得します パラメータを渡すには、キーを渡すだけでよく、このキーを使用して他のインターフェースでローカル キャッシュを再度取得します。このタイプのデータの場合、使用後はすぐにキャッシュを削除することをお勧めします。 wx.removeStorage({ キー: 'xxx'、 成功(res) { コンソール.log(res) } }) 3. グローバル変数を仲介として使う const app = getApp(); ページ({ app.globalData.isBackvalue = true; // 返された値であることを確認する app.globalData.tmpData = value; // 渡したい値、キャッシュを設定することもできます }) 返されたページにアクセスする const app = getApp(); ... onShow(){ if(app.globalData.isBackValue){ this.setData({ XXX:app.globalData.tmpデータ }) //またはキャッシュメソッドを取得して値を割り当てる} } 4. ページスタック このメソッドは、スタックにプッシュされたすべてのページに値を割り当てることができます。専門的な経験を持つ学生は、ツリーの DFS トラバーサルをプッシュ/ポップすると理解でき、スタック内のすべてのページでデータを転送できます。 var allpages = getCurrentPages(); //すべてのページデータを取得します //スタックインデックスは0から始まります。ページに入るときに読み込まれる最初のページデータはallpages[0]、現在のページはallpages[allpages.length - 1]、前のページはallpages[allpages.length - 2]です var prepagedata = allpages[allpages.length - 2].data; // 前のページのデータを取得します。 var prepage = allpages[allpages.length - 2]; //データとメソッドを含む前のページを取得します //データを設定するメソッド prepage.setData({ XXX:値 //XXXは前のページのデータ内のパラメータ、値は設定する値です}) //function メソッドを呼び出す場合、prepage.callfunction() を呼び出す前に、prepage で callfunction 関数を定義する必要があります。 5. コミュニケーションチャネル イベントチャネル ヒント (通信パイプラインの理解方法): パイプラインは、URL またはストレージによる情報伝送の形式と考えることができますが、オブジェクトの形式でカプセル化されています。 ページ配信 wx.navigateTo({ url: 'ページ B', 成功:res=>{ res.eventChannel.emit('channeldata', {name:'kindear'}) } }) Bページ受付 onLoad: 関数 (オプション) { eventChannel を this.getOpenerEventChannel() に設定します。 イベントチャネル.on('チャネルデータ', データ => { コンソール.log(データ) // 正常に印刷されました {name:'kindear'} }) } 要約するWeChatミニプログラム開発の実践スキルであるデータ転送と保存に関するこの記事はこれで終わりです。WeChatミニプログラムデータ転送と保存に関するより関連性の高いコンテンツについては、123WORDPRESS.COMで以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後も123WORDPRESS.COMを応援してください。 以下もご興味があるかもしれません:
|
<<: Centos7.6にTomcat-8.5.39をインストールする方法
>>: インスタンス化されたオブジェクトパラメータによるMySQLクエリ例の説明
夜にMACの電源を入れたところ、突然ルートアカウントがMySQLに正常にログインできなくなったため、...
画像をプルする docker プル mysql完成した画像を見る Docker イメージイメージを介...
ソングティ: SimSun太字: SimHeiマイクロソフト YaHei: マイクロソフト YaHe...
目次スロークエリログとは何ですか?スロークエリを有効にする方法ログ分析ツール mysqldumpsh...
目次序文エラー境界エラー境界を超えてトライ/キャッチwindow.onerror、エラーイベント未処...
目次序文1. NJSモジュールをインストールする方法1: NJSモジュールを動的にロードする方法2:...
さっそく、コードを直接投稿します。具体的なコードは次のとおりです。 <!--方法 1: onf...
utf8mb4 エンコーディングは utf8 エンコーディングのスーパーセットであり、utf8 と互...
みなさんこんにちは。私は梁旭です。ご存知のとおり、Linux ではデバイス ファイルも含めすべてがフ...
この記事の例では、ショッピングカートの計算を実装するためのjsの具体的なコードを参考までに共有してい...
1. Nginx サービス基盤Nginx (エンジン x) は、パフォーマンスの最適化のために特別...
join() メソッド: 指定された区切り文字を使用して配列内のすべての要素を文字列に接続します。例...
1. 単一マシン環境の構築# 1.1 ダウンロードZookeeper の対応するバージョンをダウンロ...
Docker コンテナのネットワーク障害に対する 6 つの解決策注: 以下の方法は、コンテナ内のパブ...
目次概要コンソールログコンソール.infoコンソール.警告コンソールエラーコンソールテーブルコンソー...