小程序生命周期

文件结构

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	用户点击右上角收藏

页面跳转

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": "工作经历"
            },
        ]
    }

页面传参

1. 使用data-参数名

<button type="primary" bindtap="sayHi" data-msg="小可爱">123</button>

2.跳转路径传参

<navigator url="/pages/life/life?num=30">life30</navigator>

事件绑定

wx:if：显示与隐藏

列表渲染