关于详情页是如何获取到列表数据问题(其实就是父传子)

  • 父组件中有一个点击事件 从而触发子组件
    detail 里面的变量为父组件要给子组件传过去的数据
    把detail 凭借在路径后面 传给子组件
goxiugai:function(m){
                
                let detail = {
                    rate:m.rate,
                    into:m.into,
                    id: m.id,
                    title: m.name
                };
                uni.navigateTo({
                    url: './xiugai/xiugai?detailDate=' + encodeURIComponent(JSON.stringify(detail))
                });
                    console.log(detail)
                    
            },
  • 子组件接收
    因为要一进来就渲染到页面上 所以要在onLoad 里接收
    event 为形参 可以打印一下event 看一下传过来的是什么
    定义一个变量 payload 接收
data() {
            return {
                banner:{},
                
        }
},
onLoad(event) {
            const payload = event.detailDate || event.payload;
            // 目前在某些平台参数会被主动 decode,暂时这样处理。
            try {
                this.banner = JSON.parse(decodeURIComponent(payload));
            } catch (error) {
                this.banner = JSON.parse(payload);
            }
            console.log(this.banner)
            
        },

这样就可以直接用了


    {{banner.title}}

你可能感兴趣的:(关于详情页是如何获取到列表数据问题(其实就是父传子))