美文网首页
5.小程序页面的生命周期函数

5.小程序页面的生命周期函数

作者: LucXion | 来源:发表于2023-10-17 18:18 被阅读0次
    /**
         * 生命周期函数--监听页面加载
         */
        onLoad(options) {
    
        },
    
        /**
         * 生命周期函数--监听页面初次渲染完成
         */
        onReady() {
            // 视图初始化之后再开始请求数据
            this.onPullDownRefresh()
        },
    
        /**
         * 生命周期函数--监听页面显示
         */
        onShow() {
    
        },
    
        /**
         * 生命周期函数--监听页面隐藏
         */
        onHide() {
    
        },
    
        /**
         * 生命周期函数--监听页面卸载
         */
        onUnload() {
    
        },
    
        /**
         * 页面相关事件处理函数--监听用户下拉动作
         * 需要手动在.json中设置开关,"enablePullDownRefresh": true
         */
        onPullDownRefresh : async function () {
            console.log('begin')
            this.setData({
                page: 1
            })
            const res = await this.getList()
            console.log(res)
            this.setData({
                list : res.data.data.list
            })
            // 需要手动调stopPullDownRefresh
            wx.stopPullDownRefresh()
        },
    
        /**
         * 页面上拉触底事件的处理函数
         * 不需要手动控制开关,无动画效果
         */
        onReachBottom : async function () {
            this.setData({
                page : this.data.page + 1
            })
            // 如果list内没有调用resolve,线程会一直阻塞
            const res = await this.getList()
            this.setData({
                // ES6 语法,添加
                list : [...this.data.list,...res.data.data.list]
            })
        },
    
        /**
         * 用户点击右上角分享
         */
        onShareAppMessage() {
    
        }
    

    相关文章

      网友评论

          本文标题:5.小程序页面的生命周期函数

          本文链接:https://www.haomeiwen.com/subject/dymxidtx.html