關于頁面的跳轉，微信小程序提供了3種方法：

主要從事網頁設計、PC網站建設（電腦版網站建設）、wap網站建設（手機版網站建設）、自適應網站建設、程序開發(fā)、微網站、成都微信小程序等，憑借多年來在互聯(lián)網的打拼，我們在互聯(lián)網網站建設行業(yè)積累了豐富的做網站、成都網站建設、網絡營銷經驗，集策劃、開發(fā)、設計、營銷、管理等多方位專業(yè)化運作于一體，具備承接不同規(guī)模與類型的建設項目的能力。

方法一：

使用API  wx.navigateTo()函數(shù)

示例：

首先先新建一個test頁面

如何新建頁面？

請到先閱讀下面教程

微信小程序的新建頁面 —— 微信小程序教程系列（4）

index.wxml:

在index.wxml新建一個button組件，并使用bindtap事件綁定一個函數(shù)

index.js:

在index.js中的Page函數(shù)內部，添加changeToTest 函數(shù)，函數(shù)里面使用wx.navigateTo，寫上需要跳轉的頁面，里面?zhèn)魅氲氖且粋€對象，對象內使用url屬性，對應的就是需要跳轉的頁面的路徑（注意：這是接收的是一個相對路徑，并且頁面不需要使用.wxml后綴）

運行：

方法二：

使用API  wx.redirectTo()函數(shù)

示例：

首先先新建一個test頁面

如何新建頁面？

請到先閱讀下面教程

微信小程序的新建頁面 —— 微信小程序教程系列（4）

index.wxml:

在index.wxml新建一個button組件，并使用bindtap事件綁定一個函數(shù)

index.js:

運行：

備注：

wx.navigateTo()和wx.redirectTo()的區(qū)別：

wx.navigateTo()是保留當前頁面，跳轉到某個頁面，跳轉頁面后可以返回上一頁。

wx.redirectTo()是關閉當前頁面，跳轉到某個頁面，跳轉頁面后不能返回上一頁。

方法三：

使用組件 <navigator>

示例：

首先先新建一個test頁面

如何新建頁面？

請到先閱讀下面教程

微信小程序的新建頁面 —— 微信小程序教程系列（4）

index.wxml:

在index.wxml頁面添加一個<navigator>元素，在元素里面使用屬性url就可以

運行：

跳轉的數(shù)據(jù)傳遞

以wx.navigateTo為例：

上面講述,wx.navigateTo傳入的url是跳轉的頁面（使用相對路徑）

wx.navigateTo({
 url:"pages/home/home"
});

那么參數(shù)傳遞至下一頁面，則只需要在路徑后面，添加？問號，？后面接的是參數(shù)，以key－value的方式。

這里傳了個value為2的參數(shù)

wx.navigateTo({
 url:"pages/home/home?type=2"
});

然后在home.js中的onLoad()函數(shù)中得到值：option.type就可以得到了，如下：

onLoad: function (option) {
 this.setData({
 type:option.type,
 });
 console.log(option.type);
}

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。

網站名稱：微信小程序教程系列之頁面跳轉和參數(shù)傳遞（6）
轉載來源：http://chinadenli.net/article16/jsiddg.html

成都網站建設公司_創(chuàng)新互聯(lián)，為您提供企業(yè)網站制作、做網站、微信小程序、品牌網站制作、網站內鏈、關鍵詞優(yōu)化

廣告

聲明：本網站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)