【零基础微信小程序入门开发二】配置小程序

系列文章目录

【零基础微信小程序入门开发】小程序介绍及环境搭建

👉【零基础微信小程序入门开发】配置小程序

---

上次说到小程序的介绍和环境的搭建、打印hello word，以及部分组件等一些基本功能的介绍，写的有点不详细，如果分的太细了功能又太少，于是我打算围绕开发者的文档来进行说明，这样可能更加直观一点，废话不多少，开始

---

全局配置

我们在小程序官方模板中可以看到根目录有一个app.json，这个文件用来对微信小程序进行全局配置，决定页面文件的路径、窗口表现、设置网络超时时间、设置多 tab 等。{

  "pages":[
    "pages/index/index",
    "pages/logs/logs"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#fff",
    "navigationBarTitleText": "Weixin",
    "navigationBarTextStyle":"black"
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json"
}

①pages里面的为项目路径，第一个为【“pages/index/index”,】表示优先加载该页面，其他的位次顺序无所谓，但是只有这里有文件才可以跳转

②window是对整个小程序窗口做调整

属性	默认值	描述
backgroundTextStyle	dark	下拉 loading 的样式，仅支持 dark / light
navigationBarBackgroundColor	#000000	导航栏背景颜色，如 #000000
navigationBarTitleText		导航栏标题文字内容
navigationBarTextStyle	white	导航栏标题颜色，仅支持 black / white

页面配置

属性	类型	默认值	描述
navigationBarBackgroundColor	HexColor	#000000	导航栏背景颜色，如 #000000
navigationBarTextStyle	string	white	导航栏标题颜色，仅支持 black / white
navigationBarTitleText	string		导航栏标题文字内容
navigationStyle	string	default	导航栏样式，仅支持以下值：
default	默认样式	custom	自定义导航栏，只保留右上角胶囊按钮。
backgroundColor	HexColor	#ffffff	窗口的背景色
backgroundTextStyle	string	dark	下拉 loading 的样式，仅支持 dark / light
backgroundColorTop	string	#ffffff	顶部窗口的背景色，仅 iOS 支持 微信客户端 6.5.16
backgroundColorBottom	string	#ffffff	底部窗口的背景色，仅 iOS 支持 微信客户端 6.5.16
enablePullDownRefresh	boolean	false	是否开启当前页面下拉刷新。
onReachBottomDistance	number	50	页面上拉触底事件触发时距页面底部距离，单位为px。
pageOrientation	string	portrait	屏幕旋转设置，支持 auto / portrait / landscape
disableScroll	boolean	false	设置为 true 则页面整体不能上下滚动。
usingComponents	Object	否	页面自定义组件配置 1.6.3
initialRenderingCache	string		页面初始渲染缓存配置，支持 static / dynamic 2.11.1
style	string	default	启用新版的组件样式 2.10.2
singlePage	Object	否	单页模式相关配置 2.12.0
restartStrategy	string	homePage	重新启动策略配置 2.8.0
handleWebviewPreload	string	static	控制预加载下个页面的时机。
visualEffectInBackground	string	否	切入系统后台时，隐藏页面内容，保护用户隐私。
enablePassiveEvent	Object或boolean	否	事件监听是否为 passive，若对页面单独设置则会覆盖全局的配置

sitemap 配置

sitemap.json用于微信索引，当开发者允许微信索引时，微信会通过爬虫的形式，为小程序的页面内容建立索引。当用户的搜索词条触发该索引时，小程序的页面将可能展示在搜索结果中。

以上就是今天讲解的内容