1.起因

         本来进入uniapp这个技术时间不长,就碰到一个棘手的问题,v-if与第三方组件库有冲突,虽然解决了其中一部分的难题,最终我拜倒在了uniapp的淫威之下,只能换另外一种方式进行了,不乱扯了直接进入正题

2.需求描述:

          父页面用定位获取当前位置,用户可以进行修改需要点击位置进入另外一个页面修改地理位置,然后返回父页面,并且父页面的操作全部保留我看到这个需求首先想到了父子组件用v-if切换,于是我把自己推进了深渊的开始

3.解决思路:

         起初我发现我的方式可行然而在最终马上完善的时候我发现出了问题,v-if与uview组件冲突,导致自定义校验初始化问题失效,最终我硬着头皮解决了这个问题,我没想到坑都在后面等着我,上线了随之bug也来,虽然我知道什么问题导致的也看到博客园上面解决方案都是v-if换成v-show,但是我发现并不能解决我现有的需求,虽然我喜欢钻坑我发现这次掉进去实在走不出来了,于是我只能放弃这个坑位,重新换思路,于是我想到了返回上一页这个功能,但是我并不清楚返回上一页能否携带参数,于是下面的就是我的实现方案了

  第一:既然使用组件不能满足我的要求,又不能解决我v-if这个问题,实在想不出只能放弃组件,用页面方式进行了

  第二:我研究了一下小程序的生命周期,我发现到了返回上一页会触发生命周期onshow这个生命周期,我发现了一个新大陆

  第二:我想到了我一直写vue中除了父子组件,我想到了兄弟组件

  第三:直接将我的思路开整 ,父页面跳子页面的时候我直接携带参数跳转

//父页面
onShow() {
    let that = this
    uni.$on('updateData', function(data) {
        that.formdata.locale=data.proof
        that.formdata.latitude=data.latitude
        that.formdata.longitude=data.longitude
    })
},
//方法
methods: {
        Place() {
        uni.navigateTo({
        url: '../selectMap/selectMap?locale=' +this.formdata.locale + '&latitude=' + this.formdata.latitude + '&longitude=' + this.formdata.longitude
        })
       }, 
}      
//子页面
onLoad(e) {
            this.formdata.proof = e.locale
            this.formdata.latitude = e.latitude
            this.formdata.longitude = e.longitude
            this.covers[0].latitude = e.latitude
            this.covers[0].longitude = e.longitude
        },
//方法
methods: { //确定方法 setSure() { uni.$emit('updateData', this.formdata) uni.navigateBack({ delta: 1
}) },

这就是我的实现思路,每天进步一点点

posted on 2021-06-26 17:04  小菟同学  阅读(2771)  评论(0编辑  收藏  举报

……