文件结构
1.pages 所有小程序的页面文件夹
2.app.js 全局配置逻辑
3.app.json 全局配置文件
4.app.wxss 全局样式文件
页面生命周期
函数名 | 描述 |
onLoad | 监听页面加载, |
onShow | 监听页面显示 |
onReady | 监听页面初次渲染完成 |
onHide | 监听页面隐藏 |
onUnload | 监听页面卸载 |
1.onload() 页面加载时触发。一个页面只会调用一次,可以在 onLoad 的参数中获取打开 当前页面路径中的参数
2.onShow() 页面显示/切入前台时触发
3.onReady() 页面初次渲染完成时触发。一个页面只会调用一次,代表页面已经准备妥当, 可以和视图层进行交互
4.onHide() 页面隐藏/切入后台时触发。 如 navigateTo 或底部 tab 切换到其他页面
5.onUnload() 页面卸载时触发。如 redirectTo 或 navigateBack 到其他页面时
页面相关事件处理函数
onPullDownRefresh | 用户下拉动作,一般用于下拉刷新 |
onShareAppMessage | 用户点击右上角分享 |
onShareTimeline | 用户点击右上角转发到朋友圈 |
onAddToFavorites | 用户点击右上角收藏 |
页面跳转
![](https://i-blog.csdnimg.cn/blog_migrate/78d133c448d6cc955fabc53e34495355.png)
tabBar配置
"tabBar": {
"color": "#999",
"selectedColor": "#3D98FF",
"backgroundColor": "#fff",
"borderStyle": "white",
"list": [
{
"selectedColor": "#3D98FF",
"backgroundColor": "#fff",
"selectedIconPath": "./pages/images/t1-h.png",
"iconPath": "./pages/images/t1.png",
"pagePath": "pages/home/home",
"text": "基本信息"
},
{
"selectedIconPath": "./pages/images/t1-h.png",
"iconPath": "./pages/images/t1.png",
"pagePath": "pages/job/job",
"text": "工作经历"
},
]
}
页面传参
使用data-参数名
<button type="primary" bindtap="sayHi" data-msg="小可爱">123</button>
2.跳转路径传参
<navigator url="/pages/life/life?num=30">life30</navigator>
事件绑定
wx:if:显示与隐藏
列表渲染