微信小程序页面间参数传递获取

约定不等于承诺〃 2022-04-24 07:14 323阅读 0赞

两种方式：

1.  `<navigator>跳转页面</navigator>`

test.wxml：

<view>
      
      <navigator url='/pages/gettest/gettest?id=1&name="jack"'>navigator跳转到</navigator>
    </view>

gettest.js：

/** * 生命周期函数--监听页面加载 * 微信小程序周期函数onLond中提供了options参数就是获取上一页面跳转的参数 */	
    onLoad: function (options) { 
    	console.log(options) //{id: "1", name: ""jack""}
    },

1.  路由API只用 `wx.navigateTo(Object object)` 举例

这里定义参数使用`data-参数名`的方式  
test.wxml：

<view>
      
      <button bindtap='goNext' data-id='333' data-name='jc'>bindtap点击跳转到</button>
    </view>

获取参数通过`event.target.dataset`  
test.js：

goNext(event) { 
      console.log(event.target.dataset)//{id: "333", name: "jc"}
      let id = event.target.dataset.id;
      let name = event.target.dataset.name;
      wx.navigateTo({ 
        url: '/pages/gettest/gettest?id=' + id + '&name=' + name,
      })
    }

gettest.js：

/** * 生命周期函数--监听页面加载 */
    onLoad: function (options) { 
    	console.log(options)// {id: "333", name: "jc"}
    },

发表评论取消回复

表情：

评论列表（有 0 条评论，323人围观）

还没有评论，来说两句吧...

相关阅读

相关微信小程序 -- 页面间通信

前言今天我们来说下微信小程序的页面间通信： 1. 通过url传参实现页面间单向通信 2. 通过getCurrentPages()页面栈实现页面间单向通信 3.

超、凢脫俗/ 2023年10月16日 18:11/ 0 赞/ 18 阅读

相关【微信小程序】页面之间对象的传递

1. 从当前页面传到下一页面 wx.navigateTo({ url: `../label/label?labelList=${JSON.string

绝地灬酷狼/ 2023年09月30日 21:18/ 0 赞/ 58 阅读

相关微信小程序的页面跳转和参数传递

微信小程序的页面跳转和参数传递微信小程序提供页面的跳转的3种方法：方法一：使用API wx.navigateTo()函数 ![img][] 方法二：使

落日映苍穹つ/ 2023年02月26日 02:26/ 0 赞/ 53 阅读

相关页面数据传递(微信小程序、uni-app)

页面的数据传递首先我们必须知道页面如何跳转，在wx小程序上页面的跳转可以通过 wx.navigateTo例如： wx.navigateTo({

骑猪看日落/ 2022年12月21日 06:22/ 0 赞/ 169 阅读

相关微信小程序页面间参数传递获取

两种方式： 1. `<navigator>跳转页面</navigator>` test.wxml：

约定不等于承诺〃/ 2022年04月24日 07:14/ 0 赞/ 324 阅读

相关微信小程序的页面跳转和参数传递：微信小程序教程系列06

关于页面的跳转，微信小程序提供了3种方法：方法一：使用API wx.navigateTo()函数 ![20170209122949465][] 示例：

待我称王封你为后i/ 2021年12月05日 01:09/ 0 赞/ 468 阅读

相关微信小程序传递值、传递参数

界面代码 .wxml 界面代码 <view class='content'> <block wx:for="{ {a

古城微笑少年丶/ 2021年09月23日 07:54/ 0 赞/ 504 阅读

相关微信小程序获取路径参数

微信小程序的路径参数获取跟网站页面路径参数的获取方式有点不一样。网站页面路径参数的获取方式可参考文章：[https://blog.csdn.net/Charles\_Tia

电玩女神/ 2021年09月15日 10:40/ 0 赞/ 1184 阅读

相关微信小程序 - 路由跳转以及传递参数和获取参数

路由跳转是我们在写项目过程中必用的一个api，路由跳转的方式有很多种，这里我来介绍一下不带参数的路由跳转方式以及带参数的路由跳转方式（这里通过 wx.navigateTo

待我称王封你为后i/ 2021年08月14日 00:10/ 0 赞/ 1097 阅读

相关微信小程序页面间通信

页面间通信基础库 2.7.3 开始支持，低版本需做兼容处理。如果一个页面由另一个页面通过 wx.navigateTo 打

刺骨的言语ヽ痛彻心扉/ 2021年07月24日 23:19/ 0 赞/ 523 阅读