溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要介紹“微信小程序的navigator怎么用”的相關知識，小編通過實際案例向大家展示操作過程，操作方法簡單快捷，實用性強，希望這篇“微信小程序的navigator怎么用”文章能幫助大家解決問題。
頁面鏈接。
| 屬性名 | 類型 | 默認值 | 說明 |
|---|---|---|---|
| url | String | 應用內的跳轉鏈接 | |
| open-type | String | navigate | 跳轉方式 |
| delta | Number | 當 open-type 為 'navigateBack' 時有效，表示回退的層數 | |
| hover-class | String | navigator-hover |
指定點擊時的樣式類，當hover-class="none"時，沒有點擊態效果 |
| hover-start-time | Number | 50 | 按住后多久出現點擊態，單位毫秒 |
| hover-stay-time | Number | 600 | 手指松開后點擊態保留時間，單位毫秒 |
open-type 有效值：
| 值 | 說明 | 最低版本 |
|---|---|---|
| navigate |
對應wx.navigateTo的功能 | |
| redirect |
對應wx.redirectTo的功能 | |
| switchTab |
對應wx.switchTab的功能 | |
| reLaunch |
對應wx.reLaunch的功能 | 1.1.0 |
| navigateBack |
對應wx.navigateBack的功能 | 1.1.0 |
注：navigator-hover默認為{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}, <navigator/>的子節點背景色應為透明色
示例代碼：
/** wxss **//** 修改默認的navigator點擊態 **/.navigator-hover {color:blue;
}/** 自定義其他點擊態樣式類 **/.other-navigator-hover {color:red;
}<!-- sample.wxml --><view class="btn-area"> <navigator url="/page/navigate/navigate?title=navigate" hover-class="navigator-hover">跳轉到新頁面</navigator> <navigator url="../../redirect/redirect/redirect?title=redirect" open-type="redirect" hover-class="other-navigator-hover">在當前頁打開</navigator> <navigator url="/page/index/index" open-type="switchTab" hover-class="other-navigator-hover">切換 Tab</navigator></view>
<!-- navigator.wxml --><view style="text-align:center"> {{title}} </view><view> 點擊左上角返回回到之前頁面 </view><!-- redirect.wxml --><view style="text-align:center"> {{title}} </view><view> 點擊左上角返回回到上級頁面 </view>// redirect.js navigator.jsPage({
onLoad: function(options) {this.setData({
title: options.title
})
}
})關于“微信小程序的navigator怎么用”的內容就介紹到這里了，感謝大家的閱讀。如果想了解更多行業相關的知識，可以關注億速云行業資訊頻道，小編每天都會為大家更新不同的知識點。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
