微信小程序实现页面之前传递参数

jamchili

于 2024-08-27 10:13:55 发布

阅读量197

点赞数 3

文章标签：微信小程序小程序

本文链接：https://blog.csdn.net/llllmc/article/details/141594166

版权

假设现在有个业务场景我们要把test页面里面obj里面的值传递给test2页面,很多人应该会直接拼在url路径后面或者直接存到内存中localStorage中那还有没有其他方式呢？

在这里插入图片描述

在utils中下创建一个global.js

let obj = {}

export default {
 read() {
    console.log('read', global);
  },
  set(key, value) {
    global[key] = value
  },
  get(key) {
    return global[key]
  },
  del(key) {
    delete global[key]
  },
  clear(){
    global = {}
  }
}

在app.js中导入

import global from './utils/global'
App({
  global() {
    return global
  }

})

 //html中
  <button bind:tap="toUrl">点我去test2页面</button>
 //js中
const app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    obj: {
      name: '小明',
      age: '18',
      gender: '男'
    }
  },
  toUrl() {
    //调用刚刚封装的方法 点击跳转将需要的值存储起来
    app.global().set('userObj',this.data.obj)
    wx.navigateTo({
      url: "/pages/test2/test2",
    })
  }

})

test2页面中

const app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    obj:{}
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    this.setData({
      obj: app.global().get('userObj')
    })
    //用完就销毁了哦 可以调用clear 或者 del 我这里就直接clear了
    app.global().clear()
    //在read一下 大功告成！
    app.global().read()
  },
})