微信小程序-入门到入土-01

了解小程序的目录结构
微信小程序-入门到入土-01_第1张图片

全局配置:
微信小程序-入门到入土-01_第2张图片
①在pages数组中添加“pages/demo1/demo01”+Ctrl+s保存后会自动生成一个页面文件夹
②要想优先显示该页面文件夹,只需要将该字段按要求放于做上面即可

微信小程序-入门到入土-01_第3张图片
①:navigatorBar即导航条是指:
微信小程序-入门到入土-01_第4张图片
②:“navigationBarTitleText”: " 导航条名称",这里是:CSU班费缴纳平台
③: “navigationBarBackgroundColor”: “#99FF00”, 导航条颜色
④: “navigationBarTextStyle”:“black”, 导航条标题颜色可选黑白
⑤: “enablePullDownRefresh”: true, 可否下拉刷新
⑥:“backgroundColor”: “blue” 下拉部分的颜色
⑦:“backgroundTextStyle”:“dark”,刷新圆点颜色可选:dark、light
如图示:微信小程序-入门到入土-01_第5张图片

二. tabBar设置
效果:

微信小程序-入门到入土-01_第6张图片
在app.json文件中的window下创建“tabBar”
微信小程序-入门到入土-01_第7张图片

添加“list:里面的几个变量分别是
①:pagePath:保存的是页面地址
微信小程序-入门到入土-01_第8张图片

②:text:图标下面的文字
在这里插入图片描述
③:iconPath:图标的相对路径(未点击的灰色图标)
微信小程序-入门到入土-01_第9张图片

附上常用图标网站:https://www.easyicon.net/1178751-Student_Hat_icon.html
④:SelectediconPath:被点击的彩色图标
⑤:注意tabBar的list内必须含有两个以字段
微信小程序-入门到入土-01_第10张图片
其他更多API,有兴趣的可查询官网深入学习!

第一次微信小程序学习!!日后每天分享微信小程序学习笔记!加油!

你可能感兴趣的:(微信小程序)