WeChat ミニ プログラムのページ ルーティングに関する知識ポイントのまとめ

この記事では、WeChat ミニ プログラム に関する関連知識を提供します。主にページ ルーティングに関する関連コンテンツを紹介します。ルーティングとは、パケットが送信元から宛先に送信されるときに、宛先を決定することを指します。ネットワーク全体のエンドパスのプロセスを見てみましょう。

[関連する学習の推奨事項: 小さなプログラム学習チュートリアル]

ルーティングとは何ですか?

ルーティングとは、送信元から宛先までのパケットのエンドツーエンド パスを決定するネットワーク全体のプロセスを指します。 WeChat アプレットのページ ルーティングと、ルーティング ルール (パス) に基づいてあるページから別のページにジャンプするためのルールを理解できます。

1. ページ ジャンプをトリガーするもの

1. 小さなプログラムを開始して最初のページを初期化します
2. 新しいページにジャンプして を呼び出しますwx.navigateTo または <navigator />
3. ページのリダイレクト。 wx.redirectTo または <navigator /># を呼び出します。
#ページに戻るには、ページの左上隅にある戻るボタン
4. wx.navigateBack を呼び出します。
5. wx.switchTabimplementation tabBar ページ切り替え

ヒント: すべてのページは、 などの app.json に登録する必要があります。

{
    "pages": [
        "pages/index/index",
        "pages/classification/classification",
        "pages/start/start",
        "pages/detail/detail",  
    ]
}

---

2. WeChat ミニ プログラムでページ ルーティングを実装するいくつかの方法

1. wx.navigateTo,現在のページを保持してジャンプアプリケーション ページの特定のポイントまで移動できますが、タブバー ページにはジャンプできません

wx.navigateTo({
  url: 'pages/detail/detail',
  success: function(res) {},
  ...
})

2. wx.redirectTo,現在のページを閉じて、アプリケーション内のページにジャンプしますが、タブバー ページへのジャンプは許可されていません

wx.redirectTo({
  url: 'pages/detail/detail',
  success:function(res){},
  ...
})

3. <navigator />コンポーネントジャンプメソッド

<navigator url=pages/detail/detail">跳转</navigator>

4. wx.navigateBack前のページに戻る

wx.navigateBack({
	delta: 1,
})

ヒント: delta が 1 の場合は前のページに戻ることを意味し、2 の場合は前のページに戻ることを意味し、以下同様であり、dalta が開いたページの総数より大きい場合は、ホームページに戻ります。戻った後、メタ インターフェイスは破棄されます

#wx.switchTab
5. tabBar ページにジャンプし、他のすべての非 tabBar ページを閉じます app.json:
   

   {
     "tabBar": {
       "list": [{
           "pagePath": "pages/index/index",
           "text": "首页",
       },
       {
           "pagePath": "pages/car/car",
           "text": "购物车",
         },
      ...
     }
   }

index.js:

wx.switchTab({
  url: 'pages/car/car'
})

3. ミニ プログラム ルーティングの実装原則

ミニ プログラム ルーティングは自分で実装しますスタック（先入れ先出し）で管理されます。

wx.navigateTo

または <navigator/> を通じてページ A からページ B にジャンプするとき。ルーティングスタックの変更点は以下の通りです。
ルーティング スタックには、最初はページ A のみが含まれています。

wx.navigateTo

を使用してジャンプすると、ページ B がルーティング スタックにプッシュされ、インターフェイスに表示されます。隠れたもの。

wx.navigateBack

を使用して
を返す場合、

wx.redirectTo

と wx.navigateTo違いは何ですか?現在 2 次ページ B にいる場合、

wx.redirectTo

を使用してページ C にジャンプします。プロセスは次のとおりです。
現在セカンダリ ページ B にいる場合、

wx.redirectTo

を使用してページ C にジャンプします。プロセスは次のとおりです。 [外部リンク画像転送...(img-mkPnbKug-1650431194878)]
ページ B がポップアウトされ、次にページ C がスタックにプッシュされます。この時点では、まだスタックには 2 ページしかありません。

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

小プログラム学習チュートリアル

]

以上がWeChat ミニ プログラムのページ ルーティングに関する知識ポイントのまとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。