從小程序外部跳轉到指定小程序頁面_小程序頁面獲取鏈接的方法

這篇文章將為大家詳細講解有關從小程序外部跳轉到指定小程序頁面_小程序頁面獲取鏈接的方法，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

小程序里面的鏈接使用navigator組件

在html中使用a標簽, a標簽可以鏈接到網絡中的任何地址

而小程序中navigator只能應用于當前小程序內的鏈接跳轉

<navigator url="http://www.baidu.com">跳轉A</navigator>

<navigator url='test/t'>跳轉B</navigator>

第一個是無效的

第二個能正確跳轉, 需要注意的是: url中的頁面不能是tabBar(底部菜單)中的頁面

但是可以通過open-type屬性設置

redirect屬性, 打開新頁面時, 關閉原頁面(在新頁面, 不能再返回到原頁面)

<navigator redirect url='test/t'>跳轉</navigator>

跳轉時并傳遞參數(不用加上引號, 自動會加上雙引號, 否則就多余一個引號, 因此直接寫: id=111&name=張三):

<navigator  url='test/t?id=111&name=張三'>跳轉</navigator>

通過onLoad事件獲取url參數, 在加載這個頁面時自動將參數放入

<navigator  url='test/t?id=111&name=張三' hover-class='hoverClass'>跳轉</navigator>    <!--鏈接1-->
<navigator  url='test/t?id=123&name=小明'>跳轉</navigator>    <!--鏈接2-->

Page({
  data: {

  },
  onLoad : function(datas) {
    console.log(datas);
  }
})

如果點擊鏈接1, 則datas的值是{id: "111", name: "張三"}, 點擊鏈接2, 則datas的值是{id: "123", name: "小明"}

hover-class是點上去后的樣式

wx.navigateTo

此Api也可以完成頁面跳轉, 與navigator(無redirect屬性)相同

<button size='mini' bindtap="navigator">跳轉</button>

navigator : function() {
    wx.navigateTo({
      url: 'test/t?id=100&user=xiaoming',
      success : function(e) {
        console.log(e.errMsg);
      }
    })
  }

wx.redirectTo

此Api也也可以完成頁面跳轉, 與navigator(有redirect屬性)相同, 操作與上相同

wx.navigateBack

此Api用于返回, 從當前頁面返回到上級頁面(根據如下參數)

Page({
  data: {

  },
  back : function() {
    wx.navigateBack({
      delta : 1            // 值為1, 則是返回上一級, 值為2就返回上兩級...
    })
  }
})

如果dellta的值為1, 則可以不寫dellta屬性: wx.navigateBack({})

如果dellta的值超過了其能返回的總級數, 則會返回首頁

關于從小程序外部跳轉到指定小程序頁面_小程序頁面獲取鏈接的方法就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。