小程式開發:新頁面開啟連結
導語
開發的小程式中有個使用者中心,需求是使用者可以點選按鈕從而跳轉到新連結。實際上在做這個需求的時候,並沒有很好的方法,以往的一些經驗,也不適用於小程式,查了一些資料,也沒有頭緒。最終的實現方法就是使用 navigator
元件,如果哪位有更好的方法,或者我的實現方法有缺陷,請在下方指出。
外鏈展示頁面
首先建立一個目錄,這個目錄用來展示外鏈中的內容。因為是外鏈,所以要用到 web-view
(注意這個元件有一些特性,從下方連結中檢視)。
看一下目錄結構,其中 navigator
就是展示外鏈的頁面
在 navigator.wxml
中,只需要一行程式碼即可
<web-view src="{{url}}"></web-view>
在 navigator.js
中,修改 url
中的值
onLoad: function (options) { if (options.url) { this.setData({ // 設定當前連結 url: options.url }) } },
使用者中心
在使用者中心,只需要將連結跳轉到 /navigator/navigator
中,並且帶上引數即可,看下例項
<!-- {{url}}中是外鏈地址 --> <navigator url="/navigator/navigator?url={{url}}"></navigator>
上面的方法可以實現,當然實際專案要複雜些的,根據實際需求進行修改。