小程式開發之新頁面連結開啟的方法(程式碼範例)

不言
發布: 2019-01-23 11:04:55
轉載
5607 人瀏覽過

這篇文章帶給大家的內容是關於小程式開發之新頁面連結開啟的方法(程式碼範例),有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。

開發的小程式中有個使用者中心,需求是使用者可以點擊按鈕從而跳到新連結。實際上在做這個需求的時候,並沒有很好的方法,以往的一些經驗,也不適用於小程序,查了一些資料,也沒有頭緒。最終的實作方法就是使用navigator元件,如果哪位有更好的方法,或者我的實作方法有缺陷,請在下方指出。

外鏈展示頁面

先建立一個目錄,這個目錄用來展示外鏈中的內容。因為是外鏈,所以要用到web-view(注意這個元件有一些特性,從下方連結檢視)。

看目錄結構,其中navigator就是展示外鏈的頁面

小程式開發之新頁面連結開啟的方法(程式碼範例)
在navigator.wxml中,只需要一行程式碼即可

<web-view></web-view>
登入後複製

navigator.js中,修改url中的值

onLoad: function (options) {
    if (options.url) {
      this.setData({
        // 设置当前链接
        url: options.url
      })
    } 
  },
登入後複製

使用者中心

##在使用者中心,只需要將連結跳到/navigator/navigator中,並且帶上參數即可,看下實例

<!-- {{url}}中是外链地址 -->
<navigator></navigator>
登入後複製
上面的方法可以實現,當然實際項目要複雜些的,根據實際需求進行修改。

以上是小程式開發之新頁面連結開啟的方法(程式碼範例)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:segmentfault.com
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板