微信小程序页面跳转时数据传输

1,425 阅读1分钟

1. redirectTo,reLaunch,navigateTo

wx.switchTab进行跳转,但是switchTab不可以传递url参数,后面提供了wx.reLaunch函数。

wx.navigateTo({
      url: "changeGoods/changeGoods?title=" + data,
    })

然后在changeGoods/changeGoods页面加载时可以获取参数title的值

     onLoad(options){
    console.log(`options.title`, options.title)
     }

在使用url传参数数据时候,如果传送的参数值是一个json数据,要使用JSON.stringify对json对象转换成字符串的形式

2.在全局变量中,存储在app.js中

微信小程序官方提供app.js全局变量定义文件,里面可以定义需要在全局需要使用的变量与及变量值,例如用户登录之后,需要在所有页面中使用用户登录状态等。 然后在各个页面中,首先用getApp()方法获取App实例对象 例如:

     var app=getApp();//取得全局App({..})实例
    var userInfo=app.globalData.userInfo;//取得全局变量需要的值

3.使用本地缓存的方法保存全局变量

本地缓存是有存储限制的,所以建议手动删除不再需要的缓存数据 wx.setStorage({key : value}) 然后在另一个页面使用wx.getStorage获取相应的键值名的值。

4.往组件模板之中传递数据,可以直接在模板的data-*中传递数据。

<template is="模板名" data="数据对象"/>

传递数据通过data-* 来定义(*是自定义的储存数据变量值,其中的item是真实数据)

<view class="item" wx:for="{{items}}" data-video="{{item}}"  bindtap="play">
</view>

5.通过页面栈获取到上一页面对数据进行修改

假设从A页面跳转到B页面,而B页面需要对A页面的数据进行修改处理。

//pageA
page({
   data:{
      user:kiwis
   }
})
//pageB
page({
    updateData:function(){
       var prevPage=pages[pages.length-2];
      prevPage.setData({
           user:'LaternKiwis'
       })
    }
})