微信小程序中怎么實現頁面跳轉和參數傳遞-創(chuàng)新互聯

這篇文章主要介紹了微信小程序中怎么實現頁面跳轉和參數傳遞的相關知識,內容詳細易懂,操作簡單快捷,具有一定借鑒價值,相信大家閱讀完這篇微信小程序中怎么實現頁面跳轉和參數傳遞文章都會有所收獲,下面我們一起來看看吧。

成都創(chuàng)新互聯主營定安網站建設的網絡公司,主營網站建設方案,app開發(fā)定制,定安h5小程序設計搭建,定安網站營銷推廣歡迎定安等地區(qū)企業(yè)咨詢

微信小程序之頁面跳轉和參數傳遞的實現

前言:

在微信小程序里面的跳轉其實和html里的超鏈接a差不多,我們實現跳轉可以通過標簽實現,也可以通過js實現,下面一一演示給大家看一下。

在展示demo前,我們需要先簡單的建好項目文件夾做好準備。如下:


微信小程序中怎么實現頁面跳轉和參數傳遞

標簽實現

 小程序里面有一個類似于a標簽的navigator標簽,用來做跳轉處理。


index頁面:

  <navigator url="../navigator/navigator?title=我是navi">跳轉到新的頁面</navigator>
  <navigator url="../redirect/redirect?title=我是red" redirect>跳轉到當前頁面</navigator>

navigator頁面和redirect頁面:

<view> {{title}} </view>

navigator.js頁面和redirect.js頁面:

Page({
 data:{
  title:''
 },
 onLoad:function(options){
  // 頁面初始化 options為頁面跳轉所帶來的參數
  this.setData({
    title:options.title
  })
 },
})

 而跳轉也分為兩種,一是跳轉到新頁面url后面的路徑并可以攜帶參數,一種是在后面加上redirect,在當前頁面打開,并攜帶參數。


注意:為了不讓用戶在使用小程序時造成困擾,我們規(guī)定頁面路徑只能是五層,請盡量避免多層級的交互方式。


tips:所跳轉的頁面一定不要忘了在app.json里配置喲,否則會報錯。


2. js實現

 用js實現只需要寫上跳轉代碼即可,其它如上。


wx.navigateTo({
 url: '../navigator/navigator?title=我是navi'
})
wx.redirectTo({
 url: '../redirect/redirect?title=我是red'
})

tips:仔細觀察下面圖片會發(fā)現,跳轉到其他頁面會帶有返回按鈕,在當前頁面打開則不會有。


圖片展示:


微信小程序中怎么實現頁面跳轉和參數傳遞

微信小程序中怎么實現頁面跳轉和參數傳遞

關于“微信小程序中怎么實現頁面跳轉和參數傳遞”這篇文章的內容就介紹到這里,感謝各位的閱讀!相信大家對“微信小程序中怎么實現頁面跳轉和參數傳遞”知識都有一定的了解,大家如果還想學習更多知識,歡迎關注創(chuàng)新互聯行業(yè)資訊頻道。

文章標題:微信小程序中怎么實現頁面跳轉和參數傳遞-創(chuàng)新互聯
文章起源:http://bm7419.com/article2/hdeoc.html

成都網站建設公司_創(chuàng)新互聯,為您提供軟件開發(fā)、ChatGPT、營銷型網站建設、電子商務、靜態(tài)網站、移動網站建設

廣告

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

成都app開發(fā)公司