Wechat applet page jump method and detailed explanation of carrying parameters

1. Page jump method

(1) Label jump
The attribute value of open-type corresponds to the usage in the api, that is, the usage of wx.

<navigator url="/page/navigate/navigate?title=navigate" open-type="switchTab" hover-class="navigator-hover">跳转到新页面</navigator>

(2) wx.navigateTo method jump
This method can return to the current page from the jumped page

wx.navigateTo({
url: 'pages/a/a'
})




(3) The wx. switchTab method jump is only applicable to switching to the page with tabbar set 

wx.switchTab({
url: 'pages/index/index'
})

(4) The wx.redirectTo method jump will close the current page and jump to a certain page

wx.redirectTo({
url: 'pages/a/a'
})

(5) The wx.reLaunch method will close all open pages and jump to a certain page 

wx.reLaunch({
url: 'pages/a/a'
})

(6) The wx. navigateBack method returns to the parent page, which can be returned in multiple levels 

// here is page A
wx.navigateTo({
url: 'B?id=1'
})

// here is page B
wx.navigateTo({
url: 'C?id=1'
})

// In the C page navigateBack, will return to the A page
wx.navigateBack({
delta: 2 //The number of levels to jump
})

2. The page jump carries parameters ( take the passing of two parameters as an example )

The jump with parameters is divided into two aspects. On the one hand, the page transfers parameters, and the other is the jump page to receive parameters. I will take the first two methods as examples.

1. Label jump carries parameters

a page
//a.wxml page delivery
<navigator url="/pages/b/b?id=1&tu='a.jpg' " hover-class="none">
jump to b
<navigator>

b页面
//b.js 页面接收参数
onLoad: function (options) {       //options用于接收上个页面传递过来的参数
var that = this;
that.setData({                             //this.setData的方法用于把传递过来的id转化成小程序模板语言
b_id: options.id,     //id是a页面传递过来的名称,b_id是保存在本页面的全局变量   {{b_id}}方法使用
b_tu: options.tu,
})
}


2.wx.navigateTo跳转携带参数

a页面
//a.wxml 绑定跳转函数
<view  bindtap='tapLogin' >
立即登录
</view>

//a.js 跳转函数
tapLogin:function() {
//这一步是为了把模板语言转化成js语言
var id=that.data.id; 
var tu = that.data.id

wx.navigateTo({
url: '/pages/b/b?id=' + 1 + "&tu=" + 'a.jpg'
});

},

b页面
//b.js 页面接收参数
onLoad: function (options) {       //options用于接收上个页面传递过来的参数
var that = this;
that.setData({                             //this.setData的方法用于把传递过来的id转化成小程序模板语言
b_id: options.id,     //id是a页面传递过来的名称,b_id是保存在本页面的全局变量   {{b_id}}方法使用
b_tu: options.tu,
})
}





Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325843591&siteId=291194637