欢迎光临
我们一直在努力

小程序组件components里pageLifetimes下面的函数如何应用到uniapp里? behaviors如何转换

小程序components组件:

Component({
    behaviors: [],
    properties: {
        myProperty: { // 属性名
            type: String,
            value: ''
        },
        myProperty2: String // 简化的定义方式
    },
    data: {}, // 私有数据,可用于模板渲染
    lifetimes: {
        // 生命周期函数,可以为函数,或一个在methods段中定义的方法名
        attached: function () {
        },
        moved: function () {
        },
        detached: function () {
        },
    },
    // 生命周期函数,可以为函数,或一个在methods段中定义的方法名
    attached: function () {
    }, // 此处attached的声明会被lifetimes字段中的声明覆盖
    ready: function () {
    },
    pageLifetimes: {
        // 组件所在页面的生命周期函数
        show: function () {
        },
        hide: function () {
        },
        resize: function () {
        },
    },
    methods: {
        onMyButtonTap: function () {
            this.setData({
                // 更新属性和数据的方法与更新页面数据的方法类似
            })
        },
        // 内部方法建议以下划线开头
        _myPrivateMethod: function () {
            // 这里将 data.A[0].B 设为 'myPrivateData'
            this.setData({
                'A[0].B': 'myPrivateData'
            })
        },
        _propertyChange: function (newVal, oldVal) {
        }
    }
})

uniap组件

小程序自定义组件Vue/uni-app描述
createdonServiceCreated小程序的created触发时,可以访问子组件信息,而Vuecreated访问不到,故需uni-app框架映射到其它时机(onServiceCreated)执行
attachedonServiceAttached同上
readymountedVue 生命周期
movedVue中不存在该钩子,暂不支持转换
detacheddestroyedVue 生命周期

小程序的pageLifetimes(组件所在页面的生命周期)在Vue中是没有的,需要映射为uni-app封装的页面生命周期:

小程序自定义组件uni-app描述
readyonPageShow页面被展示时执行
hideonPageHide页面被隐藏时执行
resizeonPageResize页面尺寸变化时执行
export default {  
    name: "xxxxx",  
    data() {  
        return {  

        };  
    },  
    props: {  

    },  
    onPageShow: function() {  

    },  
    onPageHide: function() {  

    },  
    onPageResize: function() {  

    },  
    methods: {  

    }  
}
赞(0)
版权归原作者所有,如有侵权请告知。达维营-前端网 » 小程序组件components里pageLifetimes下面的函数如何应用到uniapp里? behaviors如何转换

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址