本文共 1828 字，大约阅读时间需要 6 分钟。

小程序页面跳转有使用API提供方法跳转和XML设置属性跳转两种方法

一、使用API中的js方法跳转页面

1. navigateTo

保留当前页面，跳转到其他页面，可使用wx.navigateBack返回原页面。

wx.navigateTo({
     		url: 'page/home/home'  	})

2.navigateBack

关闭当前页面，返回上一级页面或者多级页面，可通过getCurrentPages()获取当前页面栈序号，通过序号返回层级。

wx.navigateTo({
     		url: 'page/news/news'// 页面 A	})	wx.navigateTo({
     		url: 'page/detail/detail'// 页面 B	})	// 跳转到页面 A	wx.navigateBack({
     		delta: 2	})

3. redirectTo

关闭当前页面，跳转到应用内的某个页面。

wx.redirectTo({
     url: 'page/home/home'})

4. switchTab

跳转到tabBar页面（在app.json中注册过的tabBar页面），同时关闭其他非tabBar页面。

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

5. reLanch

关闭所有页面，打开到应用内的某个页面。

wx.reLanch({
     url: 'page/home/home?user_id=111'})

二、使用wxml 页面组件跳转（可以通过设置open-type属性指明页面跳转方式）

1. navigator 组件默认的 open-type 为 navigate

//跳转到新页面
   

2. redirect 对应 API 中的 wx.redirect 方法

//在当前页打开
   

3. switchTab 对应 API 中的 wx.switchTab 方法

//切换 Tab
   

4. reLanch 对应 API 中的 wx.reLanch 方法

//关闭所有页面，打开到应用内`的某个页面
   

5. navigateBack 对应 API 中的 wx.navigateBack 方法

//关闭当前页面，返回上一级页面或多级页面
   

三、页面跳转传递参数

页面跳转传值在url后面拼接要传的参数即可，有两种写法

方法一

//传递一个参数	wx.navigateTo({
     		url: 'page/home/home?user_id=1'	})		//传递多个参数	wx.navigateTo({
     		url: 'page/home/home?user_id=1&&user_name=张三'	})		//传递对象	wx.navigateTo({
     		url: 'page/home/home?user=JSON.stringify(user)'//将对象转换成json字符串	})	//在接收页面onLoad方法中获取参数	onLoad: function (options) {
       	var user= JSON.parse(options.user);//将json字符串转成对象    	console.log("user "+user);  	},

方法二

//传递一个参数	wx.navigateTo({
     		url: `../detail/detail?name=${
   name}`	})		//传递多个参数	wx.navigateTo({
     		url: `../detail/detail?name=${
   name}&&id=${
   id}`	})		//传递对象	wx.navigateTo({
     		url: `page/home/home?user=$(JSON.stringify(user))`//将对象转换成json字符串	})	//在接收页面onLoad方法中获取参数	onLoad: function (options) {
       	var user= JSON.parse(options.user);    	console.log("user "+user);  	},

转载地址：http://wisvi.baihongyu.com/