小程序學習日誌5:小程序常用組件之跳轉組件(超鏈接)

導讀

經過這幾天的教程學習,大家對小程序的基本操作是否有了些許的瞭解呢?今天我們來講講其他的小程序常用組件,一起來看看吧。

正文

在我們做html的時候,常常會用到


<navigator>組件/<navigator>

小程序裡的這個組件就是我們用於小程序跳轉的組件,我們平常在使用小程序看到的跳轉基本上都是這個組件實現的,那麼,這個組件該如何去使用呢?快隨小編進一步去了解看看。

小程序學習日誌5:小程序常用組件之跳轉組件(超鏈接)

navigator組件中的URL屬性

這個屬性主要是實現了頁面中間的跳轉,那麼這個屬性該怎麼使用呢?看看下面的吧。

跳轉到logs頁面

<code>這裡我們完善一下代碼,將路徑打出來,
代碼:<navigator>跳轉/<navigator>
注意一下,這裡的跳轉到logs頁面,只需要打logs的名字就可以了,後綴不需要打。/<code>
小程序學習日誌5:小程序常用組件之跳轉組件(超鏈接)

跳轉到首頁

同樣的方法,我們也可以在logs.wxml頁面裡面設置跳轉到首頁。

<code>參考代碼:
<navigator>跳轉到首頁/<navigator>/<code>
小程序學習日誌5:小程序常用組件之跳轉組件(超鏈接)

navigator組件第二個屬性:target

這個屬性厲害了,他不僅可以實現本小程序的跳轉,還可以跳轉到別的小程序上面去,你平常在網上玩小程序看到的很多廣告鏈接跳轉到美團什麼的地方都是靠這個實現的。

打開微信開發者手冊,我們可以看到這個屬性有兩個合法值,第一個是默認的,本小程序,第二個設置後可以跳轉到其他小程序。

這裡就先不跟大家說了,以後有時間會慢慢聊的。

小程序學習日誌5:小程序常用組件之跳轉組件(超鏈接)

navigator組件的第三個屬性:open-type

我們先打開微信開發者文檔,可以看到,這個屬性有六個合法值,其中,第一個合法值是默認的。

小程序學習日誌5:小程序常用組件之跳轉組件(超鏈接)

  1. navigate:這個功能可以用於從一個頁面跳轉到另外一個頁面,而且前一個頁面不會銷燬,這個小程序用於一些填寫的表單文件是再好不過的了。
  2. redirect:這個屬性是用於可以跳轉到首頁,但不可以跳轉到上個頁面
<code>這裡有必要說一下,大家可以看,這是之前的,這裡的圖標是個箭頭,但是我們加入後呢?/<code> 
小程序學習日誌5:小程序常用組件之跳轉組件(超鏈接)

<code>參考代碼:
<navigator>跳轉/<navigator>
可以看到,現在的圖標變成了一個小房子,這個小房子就只能跳轉到首頁了。/<code>
小程序學習日誌5:小程序常用組件之跳轉組件(超鏈接)

總結:

<navigator>組件屬性(跳轉組件)/<navigator>

  • url

屬性意思,實現本小程序內部各頁之間的跳轉。

  • target

屬性意思:可以設置跳轉到本小程序,也可以跳轉到其他小程序

  • open-type
  1. navigate:這個功能可以用於從一個頁面跳轉到另外一個頁面,而且前一個頁面不會銷燬,這個小程序用於一些填寫的表單文件是再好不過的了。
  2. redirect:這個屬性是用於可以跳轉到首頁,但不可以跳轉到上個頁面

寫在最後

感謝大家能在百忙之中抽出時間看小編的文章,本文章是小編一個字一個字打出來的,你的關注和收藏就是小編的東西,謝謝大家了。


分享到:


相關文章: