微信小程序前后页面传值

这篇具有很好参考价值的文章主要介绍了微信小程序前后页面传值。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

微信小程序前后页面传值

  • 从前一个页面跳转到下一个页面,如何传递参数?
  • 从后一个页面返回前一个页面,如何回调参数?

向后传值

从前一个页面跳转到下一个页面并传值。

前页面:在跳转链接中添加参数并传递

wx.navigateTo({
  url: 'page/path?key=value'
})

后页面:在onLoad()函数中接收参数

onLoad: function(options) {
  console.log(options.key) // 输出 value
}

这种方式适合小规模的传参,适合传输“较大”的数据吗?例如,我们需要传递一个字典的值过去,将整个字典转json后作为value,定义一个key传过去,这样传值微信小程序平台支持吗?再者就是 “url” 里的参数长度有什么限制没?

回调传值

从后一个页面返回上一个页面并传值。

当前页面:拿到前一个页面的实例,调用前一个页面的方法

let pages = getCurrentPages();
let prevPage = pages[pages.length - 2]; // 上一个页面
prevPage.setData({
  key: newValue
})
wx.navigateBack();

或者:

  1. 在前一个页面定义一个函数
callback(e) {
    console.log(e)
    
}
  1. 在当前页面调用前一页面的函数
let pages = getCurrentPages();
let prevPage = pages[pages.length - 2]; // 上一个页面
prevPage.callback({key: value})

微信小程序没有类似于代理或者block之类的回调,但是上面的方式来实现回调更加直接,其本质上和代理,lock的原理是一样的。文章来源地址https://www.toymoban.com/news/detail-631531.html

到了这里,关于微信小程序前后页面传值的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序详细讲解页面传值,globalData,wx,web前端开发基础

    在其他非app.js文件中修改: var app = getApp() ​ app.globalData.hasLogin = true 二、 使用 wx.navigateTo 与 wx.redirectTo 的时候,可以将部分数据放在 url 里面,并在新页面 onLoad 的时候初始化 // Navigate wx.navigateTo({ url: ‘…/pageD/pageD?name=raymondgender=male’, }) ​ // Redirect wx.redirectTo({ url: ‘…/p

    2024年04月25日
    浏览(60)
  • 微信小程序有哪些传值(传递数据)方法

    URL参数传递: 可以通过URL参数的方式将数据传递给小程序页面。 Storage存储: 可以通过Storage API将数据存储在本地,然后在小程序页面中读取。 全局变量: 可以将数据存储在小程序的全局变量中,然后在小程序页面中读取。 数据绑定: 可以通过数据绑定的方式将数据传递给

    2024年02月06日
    浏览(53)
  • Gpt微信小程序搭建的前后端流程 - 前端小程序部分-1.基础页面框架的静态设计(二)

    Gpt微信小程序搭建的前后端流程 - 前端小程序部分-1.基础页面框架的静态设计(二) 在开始这个专栏,我们需要找一个小程序为参考,参考和仿照其界面,聊天交互模式。 这里参考小程序- 小柠AI智能聊天 ,可自行先体验。 该小程序主要提供了以下几点 功能向需求 : 每天免费

    2024年02月14日
    浏览(43)
  • 巧用回调函数解决微信小程序与后台数据交互出现的异步问题

            微信小程序端需要发送一个包含文字与图片的表单数据给后端,我一开始的思路是 先 上传图片得到临时的URL, 后 执行POST请求将表单数据发送给后端,但后端只能获取到文字,而图片URL却始终获取不到。         注意看我上面的思路, 一先一后 ,无形中将两

    2024年02月16日
    浏览(44)
  • 微信小程序前后端数据交互

         目录 一 微信小程序发送请求 二 后端接口接受小程序请求并返回数据  三 最后的效果图     先简单说一下我写的这个微信小程序前后端交互的业务,主要是两个数据:supplyCount和wantBuyCount,分别代表我的车源和我的求购。目前的需求就是小程序向后端发送请求,然后

    2024年02月09日
    浏览(39)
  • 微信小程序:父子组件传值

    在微信小程序里,父组件可以向子组件传值,子组件也可以向父组件传值,不过这两种传值方式不大相同,下面先简单介绍这两种传值的区别。 两者的区别 父组件向子组件传值,使用的是   属性绑定   的方法,并且只能传递普通类型的数据 子组件向父组件传值,使用的是

    2024年02月07日
    浏览(62)
  • 【微信小程序】父子组件之间传值

    1. 父组件向子组件 传值 2. 子组件向父组件 传值 父向子传值使用的是 属性绑定 ,子组件中的 properties 对象进行接收父组件传递过来的值。 子向父传值使用的是 自定义事件 ,父组件通过自定义事件中的 事件对象e 来接收子组件传递过来的值。 1.1 在父组件的.json文件中导入子

    2024年02月16日
    浏览(48)
  • 微信小程序怎样给事件传值的

    通过自定义属性传值: 在触发事件的组件上,可以通过自定义属性将需要传递的值绑定到事件对象上。在事件处理函数中,通过 event.currentTarget.dataset 来获取自定义属性的值。 代码如下: 通过事件对象传值: 在触发事件时,可以使用 event.detail 将值传递给事件处理函数。在

    2024年02月03日
    浏览(40)
  • 微信小程序的几种传值方式

    目录 一、使用全局变量传递数据 二、本地存储传递数据 三、使用路由传递数据 四、父子组件之间传值 提示:利用 app.js 中的 globalData 将数据存储为 全局变量 ,在需要使用的页面通过 getApp().globalData 获取 提示:利用微信小程序提供的本地存储 wx.setStorageSync  与 wx.getStorage

    2023年04月09日
    浏览(48)
  • 微信小程序之组件的四种传值方式

             我们可以利用微信小程序提供的本地存储 wx.setStorageSync 与 wx.getStorageSync 进行传值。  传递组件 接收组件 传递组件  接收组件 这时因为传递的是对象类型的数据,到另一个页面获取时会发现是\\\"[object,object]\\\",解决方法是利用JSON.stringify()和JSON.parse() 传递数据的组件

    2024年02月16日
    浏览(39)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包