WeChatアプレットの設定について-ミニプログラム開発-php.cn

WeChatアプレットの設定について

不言

リリース： 2018-06-22 16:18:51

オリジナル

2727 人が閲覧しました

この記事では、主にミニプログラムの構成に関する WeChat ミニプログラムチュートリアルの関連情報を紹介します。ここでは、app.json、ページ、ウィンドウなどについて詳しく説明します。WeChat ミニプログラムの開発が初めての方向けに、詳細を説明します。これらをマスターすることが重要です。必要な友人は、

WeChat ミニプログラム - 構成

を参照してください。以下は、ミニプログラムの構成情報を体系的に整理したもので、開発者に役立つことを願っています。

app.json ファイルを使用して、WeChat アプレットのグローバル構成、ページファイルのパス、ウィンドウのパフォーマンスの決定、ネットワークタイムアウトの設定、複数のタブの設定などを行います。

以下は、すべての構成オプションを含む単純な構成 app.json です:

{
 "pages": [
  "pages/index/index",
  "pages/logs/index"
 ],
 "window": {
  "navigationBarTitleText": "Demo"
 },
 "tabBar": {
  "list": [{
   "pagePath": "pages/index/index",
   "text": "首页"
  }, {
   "pagePath": "pages/logs/logs",
   "text": "日志"
  }]
 },
 "networkTimeout": {
  "request": 10000,
  "downloadFile": 10000
 },
 "debug": true
}

ログイン後にコピー

app.json 構成項目リスト

tabBarオブジェクトいいえ下部タブのパフォーマンスを設定します networkTimeoutObjectNo ネットワークタイムアウトを設定します debugBooleanNo デバッグをオンにするかどうかを設定しますモード

属性	タイプ	必須	説明
ページ	配列	はい	ページパスを設定します
ウィンドウ	オブジェクト	いいえ	デフォルトページのウィンドウ表現を設定します

pages

ミニプログラムがどのページで構成されているかを指定するために、各項目が文字列である配列を受け入れます。各項目は対応するページの [パス + ファイル名] 情報を表し、配列の最初の項目はミニプログラムの最初のページを表します。ミニプログラムでページを追加/削減するには、ページ配列を変更する必要があります。

フレームワークは統合のためにパス .json、.js、.wxml、および .wxss 内の 4 つのファイルを自動的に検索するため、ファイル名にファイル接尾辞を付ける必要はありません。

開発ディレクトリが

pages/
pages/index/index.wxml
pages/index/index.js
pages/index/index.wxss
pages/logs/logs.wxml
pages/logs/logs.js
app.js
app.json
app.wxss

ログイン後にコピー

の場合、app.json に

{
 "pages":[
  "pages/index/index"
  "pages/logs/logs"
 ]
}

ログイン後にコピー

window

を記述して、ミニプログラム、タイトル、ウィンドウの背景色。

プロパティタイプデフォルト値説明navigationBarBackgroundColorHexColor#000000ナビゲーションバーの背景カラー、「#000000」などnavigationBarTextStyle文字列whiteナビゲーションバーのタイトルの色、黒/白のみをサポートしますnavigationBarTitleTextStringナビゲーションバーのタイトルのテキストコンテンツbackgroundColorHexColor#ffffffの背景色ウィンドウbackgroundTextStyleStringdarkドロップダウンの背景フォントと読み込み画像のスタイルは、dark/lightのみをサポートします

注: HexColor (16進数のカラー値)、「」など#ff00ff"

app.json など:

{
 "window":{
  "navigationBarBackgroundColor": "#ffffff",
  "navigationBarTextStyle": "black",
  "navigationBarTitleText": "微信接口功能演示",
  "backgroundColor": "#eeeeee",
  "backgroundTextStyle": "light"
 }
}

ログイン後にコピー

tabBar

アプレットがマルチタブアプリケーションの場合 (クライアントの下部にタブバーがある)ページを切り替えるウィンドウ) を設定すると、タブバーのパフォーマンスと、タブを切り替えたときに表示される対応するページを tabBar 設定項目で指定できます。

tabBar は配列であり、少なくとも 2 つ、最大 5 つのタブのみを構成できます。タブは配列の順序でソートされます。

プロパティの説明:

プロパティタイプ必須デフォルト値説明色HexColorはいタブ上のテキストのデフォルトの色selectedColorHexColorは、タブが選択されているときのテキストの色です backgroundColorHexColorはタブの背景色 borderStyleStringいいえblackタブバーの上枠の色は黒/白のみをサポートしますlistArrayはタブのリストです、リストを参照してください詳細については属性の説明、最小 2、最大 5 タブ

其中 list 接受一个数组，数组中的每个项都是一个对象，其属性值如下：

属性	类型	必填	说明
pagePath	String	是	页面路径，必须在 pages 中先定义
text	String	是	tab 上按钮文字
iconPath	String	是	图片路径，icon 大小限制为40kb
selectedIconPath	String	是	选中时的图片路径，icon 大小限制为40kb

networkTimeout

可以设置各种网络请求的超时时间。

属性说明：

属性	类型	必填	说明
request	Number	否	wx.request的超时时间，单位毫秒
connectSocket	Number	否	wx.connectSocket的超时时间，单位毫秒
uploadFile	Number	否	wx.uploadFile的超时时间，单位毫秒
downloadFile	Number	否	wx.downloadFile的超时时间，单位毫秒

debug

可以在开发者工具中开启 debug 模式，在开发者工具的控制台面板，调试信息以 info 的形式给出，其信息有Page的注册，页面路由，数据更新，事件触发 。可以帮助开发者快速定位一些常见的问题。

page.json

每一个小程序页面也可以使用.json文件来对本页面的窗口表现进行配置。页面的配置比app.json全局配置简单得多，只是设置 app.json 中的 window 配置项的内容，页面中配置项会覆盖 app.json 的 window 中相同的配置项。
页面的.json只能设置 window 相关的配置项，以决定本页面的窗口表现，所以无需写 window 这个键，如：

{
 "navigationBarBackgroundColor": "#ffffff",
 "navigationBarTextStyle": "black",
 "navigationBarTitleText": "微信接口功能演示",
 "backgroundColor": "#eeeeee",
 "backgroundTextStyle": "light"
}

ログイン後にコピー

以上就是本文的全部内容，希望对大家的学习有所帮助，更多相关内容请关注PHP中文网！