微信小程序开发-笔记

一、开发文件结构

1.根目录下有三个文件:app.js,app.json和app.wxss。一个小程序项目必须有的三个描述App的文件。这三个文件是应用程序级别的文件。这3个文件的意义:

表1.1  app.js,app.json和app.wxss文件的含义
文件必填作用
app.js小程序逻辑文件
app.json小程序配置文件
app.wxss全局公共样式文件

 

2.和这三个应用程序级别文件平行的pages文件夹。一个小程序由若干个页面文件构成。每个页面由4个文件构成,分别是:.js,.json,.wxml和.wxss文件。这4个文件意义:

表1.2  .js,.wxml,.wxss和.json文件的含义
文件必填作用
.js页面逻辑
.json页面配置
.wxml页面结构
.wxss页面样式表

二、配置程序:

1.app.json文件是小程序最基本的全局配置文件,它决定页面文件的路径(路由)、窗口表现、设置网络超时时间、设置多Tab等。对于app.json的具体配置如下表:

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

1).pages:

pages接受一个数组,每一项都是字符串,来指定小程序由哪些页面组成。每一项代表对应页面的(路径+文件名)信息,数组的第一项代表小程序的初始页面。例如:在app.json配置:

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

2).window

window属性用于设置小程序的状态栏、导航条、标题、窗口背景色、具体含义及配置如表2.2

表2.2  window属性及配置
属性类型默认值描述
navigationBarBackgroundColorHexColor#000000导航栏背景颜色
navigationBarTextStyleStringwhite导航栏标题颜色,仅支持dark/white
navigationBarTitleTextString导航栏标题文字内容
backgroundColorHexColor#ffffff窗口的背景色
backgroundTextStyleStringdark下拉背景字体、loading图的样式、仅支持dark/white
enablePullDownRefreshBooleanfalse是否开启下拉刷新

 

3).tabBar

tabBar

用于配置小程序的菜单选项。tabBar是一个数组,只能配置最少2个、最多5个tab,tab按数组的顺序排序,其具体配置属性如表2.3

表2.3  tabBar属性配置
属性类型必填默认值描述
colorHexColor tab上的文字默认颜色
selectedColorHexColor tab上的文字选中时颜色
backgroundColorHexColor tab的背景颜色
borderStyleStringblacktabBar上边框的颜色,仅支持black/white
listArray tab的列表,详见表2.4
positionStringbottom可选值bottom、top

tabBar的属性list是一个数组,数组中的每一项都是一个对象,属性表如表2.4

表2.4  list属性
属性类型必填说明
pagePathString页面路径,必须在pages中先定义
textStringtab上按钮的文字
iconPathString图片路径,icon大小限制为40KB,建议尺寸为81px * 81px
selectediconPathString选中时的图片路径,icon大小限制为40KB,建议尺寸为81px * 81px

例如:将两个页面链接指向首页和日志页:

"tabBar":{
     "list":[{
       "pagePath":"pages/index/index",
       "text":"首页"
      },{
       "pagePath":"pages/logs/logs",
       "text":"日志"
      }]
}

4).networkTimeout

networkTimeout属性可以设置各种网络请求的超时时间,具体属性如表2.5

表2.5  networkTimeout属性
属性类型必填说明
requestNumberwx.request的超时时间,单位毫秒,默认为:60000
connectSocketNumberwx.connectSocket的超时时间,单位毫秒,默认为:60000
uploadFileNumberwx.uploadFile的超时时间,单位毫秒,默认为:60000
downloadFileNumberwx.downloadFile的超时时间,单位毫秒,默认为:60000

2.page.json

每一个小程序页面可以使用.json文件来对本页面的窗口表现进行配置,页面中配置项会覆盖app.json的window中相同的配置项。page.json配置属性如表2.6

表2.6  page.json的配置属性
属性类型默认值描述
navigationBarBackgroundColorHexColor#000000导航栏背景颜色
navigationBarTextStyleStringwhite导航栏标题颜色,仅支持dark/white
enablePullDownRefreshBooleanfalse是否开启下拉刷新
backgroundTextStyleStringdark下拉背景字体、loading图的样式、仅支持dark/white
backgroundColorHexColor#ffffff窗口的背景色
navigationBarTitleTextString导航栏标题文字内容
diaableScrollBooleanfalse设置为true,则页面整体不能上下滚动

仅是自己在学微信小程序的笔记。

转载于:https://www.cnblogs.com/Lia-633/p/7808849.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值