最近、小さなプログラムの開発を勉強して見直しており、学習結果のいくつかをメモしています。公式の WeChat ミニプログラムのドキュメントを参照してください: developer.weixin.qq.com/miniprogram… 1. ミニプログラムの構成1. グローバル構成 ミニプログラムのルート ディレクトリにある app.json ファイルは、WeChat ミニプログラムをグローバルに構成したり、ページ ファイルのパスやウィンドウのパフォーマンスを決定したり、ネットワーク タイムアウトを設定したり、複数のタブを設定したりするために使用されます。 // 例 { 「ページ」: [ 「ページ/インデックス/インデックス」、 「ページ/ログ/インデックス」 ]、 「ウィンドウ」: { "navigationBarTitleText": "デモ" }, "タブバー": { 「リスト」: [{ "ページパス": "ページ/インデックス/インデックス", "テキスト": "ホーム" }, { "ページパス": "ページ/ログ/インデックス", "text": "ログ" }] }, "ネットワークタイムアウト": { 「リクエスト」: 10000, 「ダウンロードファイル」: 10000 }, 「デバッグ」: true } 2. ページ構成 各ミニプログラム ページでは、同じ名前の .json ファイルを使用して、このページのウィンドウ パフォーマンスを構成することもできます。ページ内の構成項目は、app.json のウィンドウ内の同じ構成項目を上書きします。 // 例 { "ナビゲーションバーの背景色": "#ffffff", "ナビゲーションバーのテキストスタイル": "黒", "navigationBarTitleText": "WeChat API 関数のデモンストレーション", "背景色": "#eeeeee", "backgroundTextStyle": "light" } 3. サイトマップの設定 注: サイトマップ インデックス プロンプトはデフォルトで有効になっています。サイトマップ インデックス プロンプトをオフにする必要がある場合は、ミニ プログラム プロジェクト構成ファイル project.config.json の設定で checkSiteMap フィールドを false に構成できます。 ミニプログラムのルート ディレクトリにある sitemap.json ファイルは、ミニプログラムとそのページを WeChat でインデックス化できるかどうかを構成するために使用されます。 WeChat でインデックスするかどうかを設定するには、次の 2 つの方法があります。 1. ページインデックス設定:ミニプログラム全体のインデックス、ミニプログラム管理の背景 - 機能 - ページコンテンツアクセス - ページインデックススイッチを閉じることができます。 2. サイトマップの設定: 特定のページのインデックスを閉じることができます。 // すべてのページはWeChatによってインデックスされます(デフォルト) { 「ルール」:[{ "アクション":"許可", "ページ":"*" }] } // パス/ページへのページはインデックス化されていませんが、残りはインデックス化されます { 「ルール」:[{ "アクション":"許可しない", "page":"ページへのパス" }] } 2. ミニプログラムの5つのルート1. wx.navigateTo() 現在のページを保持し、アプリ内のページにジャンプします。タブバーページにジャンプできません。ミニプログラム内のページスタックは最大 10 レベルの深さまで可能です。10 レベルを超える場合は、wx.redirectTo を使用してジャンプできます。 wx.navigateTo({ url:"リスト?id=2", イベント:{ //ページ間通信インターフェース。開いているページから現在のページに送信されるデータを監視するために使用されます。 someEvent:関数(データ){ コンソール.log(データ) } }, 成功:function(res){ // 開かれたページにeventChannelを介してデータを送信します res.evnetChannel.emit('someEvent',{dta:'list'}) } }) 2. wx.redirectTo() 現在のページを閉じて、アプリ内のページに移動します。ただし、タブバーページにジャンプすることはできません。 // 例 wx.redirectTo({ url:'リスト?id=2', 成功:function(){}, 失敗:関数(){} }) 3. wx.switchTab() tabBar ページに移動し、tabBar 以外のページをすべて閉じます。 wx.switchTab({ url:'/index' }) 4. wx.navigateBack() 現在のページを閉じて、前のページまたは複数のページに戻ります。 getCurrentPages を使用すると、現在のページ スタックを取得し、返すレベルの数を決定できます。 // これはページAです wx.navigateTo({ url: 'B?id=1' }) // これはページBです wx.navigateTo({ url: 'C?id=1' }) // ページ C の NavigateBack はページ A に戻ります wx.navigateBack({ デルタ: 2 }) 5. wx.reLaunch() すべてのページを閉じて、アプリでページを開きます。 //例 wx.reLaunch({ url:'リスト?id=2' }) 注: また、ジャンプに関連する Web ビューのページからミニ プログラムに戻るにはどうすればよいですか? wx.miniPrograme.navigateTo({ url:'pages/login/login'+'params' }) // ミニプログラムのナビゲーションページにジャンプします wx.miniPrograme.switchTab({ url:"/pages/index/index" }) 要約するWeChatミニプログラムの学習ノートのページ構成とルーティング方法についての記事はこれで終わりです。ミニプログラムのページ構成とルーティング方法についてのより関連性の高いコンテンツについては、123WORDPRESS.COMで以前の記事を検索するか、以下の関連記事を引き続き閲覧してください。今後とも123WORDPRESS.COMを応援していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: Ubuntu 14 に Nginx-RTMP ストリーミング サーバーをインストールするチュートリアル
>>: Linux ベースの MySQL マスター スレーブ構成の全プロセスを記録する
この記事では ソースコードのオンラインプレビューとダウンロード今日のチュートリアルでは、円のホバー効...
CSSスタイルとHTMLタグ要素を使用するさまざまな HTML タグに点線の境界線を追加するために、...
この記事では、画像テキストセグメンテーションを実装するためのNodeJSの具体的なコードを参考までに...
目次問題の説明:インストール手順1. 準備2. サーバーにリモート接続する3. 証明書と秘密鍵ファイ...
123WORDPRESS.COM HTML チュートリアル セクションに戻るには、ここをクリックして...
MySQL 5.7.27のインストールチュートリアルは以下のように記録され、皆さんと共有されています...
Docker を初めて使い始めると、通常とは異なる問題に遭遇して、必然的に混乱してしまいます。大丈夫...
1. はじめに少し前、開発者がテスト環境や本番環境で誤った操作をし、データベースを誤って削除/更新し...
この記事では、キャンバスを使用して画像圧縮アップロードを実現するVueの具体的なコードを参考までに共...
この記事では、Jingdongの詳細ページの画像の拡大を実現するためのjsの具体的なコードを紹介しま...
MySQLサービスを停止するWindowsでは、マイコンピュータを右クリック--管理--サービスと...
この例では、Linux への Python 3.8 のインストールを例に挙げます。 1. 依存パッケ...
質問docker run コマンドを使用して、tomcat コンテナが正常に追加されました。ポートも...
この記事では、フォームの隠しテキストを表示するためのJavaScriptの具体的なコードを参考までに...
Mysqlが2つのテーブルを関連付けると、次のエラーメッセージが生成されます:照合順序の不正な組み合...