Vous apprendre à configurer l'applet WeChat

Y2J
Libérer: 2017-04-21 11:58:58
original
2992 Les gens l'ont consulté

Cet article présente principalement les informations liées à la configuration du didacticiel du programme WeChat Mini. Voici une introduction détaillée à app.json, aux pages, à la fenêtre, etc. Pour ceux qui débutent dans le développement de programmes WeChat Mini, c'est toujours le cas. Il est important de les maîtriser. Oui, les amis dans le besoin peuvent se référer au

Programme WeChat Mini - Configuration

Ce qui suit est l'arrangement systématique par l'éditeur des informations de configuration du mini. programme. J'espère que cela pourra être utile aux développeurs.

Nous utilisons le fichier app.json pour configurer globalement l'applet WeChat, déterminer le chemin du fichier d'échange, les performances de la fenêtre, définir le délai d'expiration du réseau, définir plusieurs onglets, etc.

Ce qui suit est un app.json de configuration simple qui contient toutes les options de configuration :

{
 "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
}
Copier après la connexion

liste des éléments de configuration app.json

属性类型必填描述
pagesArray设置页面路径
windowObject设置默认页面的窗口表现
tabBarObject设置底部 tab 的表现
networkTimeoutObject设置网络超时时间
debugBoolean设置是否开启 debug 模式

pages

accepte un tableau, chaque élément est une chaîne, pour spécifier de quelles pages se compose le mini programme. Chaque élément représente les informations [chemin + nom du fichier] de la page correspondante, et le premier élément du tableau représente la page initiale du mini-programme. L'ajout/réduction de pages dans le mini programme nécessite de modifier le tableau des pages.

Le nom du fichier n'a pas besoin d'être écrit avec un suffixe de fichier, car le framework recherchera automatiquement les quatre fichiers dans le chemin .json, .js, .wxml et .wxss pour l'intégration. .

Si le répertoire de développement est :

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
Copier après la connexion

, nous devons écrire

{
 "pages":[
  "pages/index/index"
  "pages/logs/logs"
 ]
}
Copier après la connexion

window< dans app.json 🎜>

Utilisé pour définir la barre d'état, la barre de navigation, le titre et la couleur d'arrière-plan de la fenêtre du mini programme.

属性类型默认值描述
navigationBarBackgroundColorHexColor#000000导航栏背景颜色,如"#000000"
navigationBarTextStyleStringwhite导航栏标题颜色,仅支持 black/white
navigationBarTitleTextString 导航栏标题文字内容
backgroundColorHexColor#ffffff窗口的背景色
backgroundTextStyleStringdark下拉背景字体、loading 图的样式,仅支持 dark/light

Remarque : HexColor (valeur de couleur hexadécimale), telle que "#ff00ff"

telle que app.json :

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

tabBar

Si notre applet est une application multi-onglets (il y a une barre d'onglets en bas de la fenêtre client pour basculer pages), nous pouvons alors spécifier les performances de la barre d'onglets via l'élément de configuration tabBar et la page correspondante affichée lorsque l'onglet est changé.


tabBar est un tableau. Seuls un minimum de 2 et un maximum de 5 onglets peuvent être configurés. Les onglets sont triés dans l'ordre du tableau.


Description de l'attribut :

属性类型必填默认值描述
colorHexColor tab 上的文字默认颜色
selectedColorHexColor tab 上的文字选中时的颜色
backgroundColorHexColor tab 的背景色
borderStyleStringblacktabbar上边框的颜色, 仅支持 black/white
listArray tab 的列表,详见 list 属性说明,最少2个、最多5个 tab
où la liste accepte un tableau, chaque élément du tableau est un objet et ses valeurs d'attribut sont les suivantes :

networkTimeout

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

属性说明:

属性类型必填说明
requestNumberwx.request的超时时间,单位毫秒
connectSocketNumberwx.connectSocket的超时时间,单位毫秒
uploadFileNumberwx.uploadFile的超时时间,单位毫秒
downloadFileNumberwx.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"
}
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal