任務7 跳轉到子頁面
任務描述
實現頁面之間的跳轉功能。
1)在首頁添加按鈕,綁定事件,通過事件實現跳轉到另一子頁面。
2)在子頁面添加鏈接,用鏈接實現跳轉到首頁。
操作步驟
1 新建一個小程序項目,如圖1-46所示。

圖1-46 新建一個小程序項目
2 打開index/index.wxml文件,添加“<button bindtap="tologs">跳轉到日志頁面</button>”組件,得到一個綁定了tologs函數的按鈕,如圖1-47所示。

圖1-47 綁定了tologs函數的按鈕
3 打開index/index.js文件,添加:

設計的函數名稱是tologs,執行跳轉到../logs/logs頁面的功能,如圖1-48所示。

圖1-48 設計的函數名稱是tologs
4 打開logs/logs文件,添加:

實現跳轉到../index/index頁面的功能,如圖1-49所示。
經驗分享
在頁面跳轉實現中,不管是應用API函數wx.navigateTo({url: '../logs/logs'}),還是應用組件<navigator url="../index/index">,其中的url的定義就相當于網頁設計中的URL(統一資源定位符),路徑的應用也與網頁設計的相似。

圖1-49 實現跳轉到../index/index頁面的功能
知識鏈接
在微信小程序項目開發中,若有多個頁面,則頁面之間的跳轉是必不可少的。頁面之間的跳轉實現有許多方式,既可以通過JavaScript命令實現,也可以通過鏈接實現。
推薦閱讀
- Integrating Facebook iOS SDK with Your Application
- SQL 經典實例
- Django 3.0入門與實踐
- Flask Web開發:基于Python的Web應用開發實戰(第2版)
- QlikView Unlocked
- Getting Started with Electronic Projects
- SFML Game Development
- Python Linux系統管理與自動化運維
- 網絡綜合布線與組網實戰指南
- C# 10核心技術指南
- HTML5/CSS3/JavaScript技術大全
- Python自動化運維:技術與最佳實踐
- Mathematica Data Visualization
- Learning Ext JS(Fourth Edition)
- Python語言及其應用(第2版)