微信小程序 wxapp導航 navigator詳解
更新時間：2016年10月31日 15:16:07 投稿：lqh
這篇文章主要介紹了微信小程序 wxapp導航 navigator詳解的相關資料,并附簡單實例代碼，需要的朋友可以參考下
微信小程序 wxapp導航 navigator
最近微信小程序非?；穑笥讶?，微博，論壇等地方都在刷屏，因為這是搞前端的春天，前端工程師可以賺一把了，所以業(yè)余就學習了微信小程序的知識，這里記錄下 ：
navigator
| 屬性名 | 類型 | 默認值 | 說明 |
|---|---|---|---|
| url | String | 應用內的跳轉鏈接 | |
| redirect | Boolean | false | 是否關閉當前頁面 |
| hover-class | String | navigator-hover | 指定點擊時的樣式類，當hover-class="none"時，沒有點擊態(tài)效果 |
注：navigator-hover默認為{background-color:rgba(0,0,0,0.1);opacity:0.7;},<navigator/>的子節(jié)點背景色應為透明色
示例代碼：
/** wxss **/
/** 修改默認的navigator點擊態(tài) **/
.navigator-hover{
color:blue;
}
/** 自定義其他點擊態(tài)樣式類 **/
.other-navigator-hover{
color:red;
}
<!-- sample.wxml --> <view class="btn-area"> <navigator url="navigate?title=navigate" hover-class="navigator-hover">跳轉到新頁面</navigator> <navigator url="redirect?title=redirect" redirect hover-class="other-navigator-hover">在當前頁打開</navigator> </view> </navigator>
<!-- 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.js
Page({
onLoad: function(options) {
this.setData({
title: options.title
})
}
})
感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
相關文章
這篇文章主要為大家介紹了JavaScript中單例模式的應用場景案例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-05-05
這篇文章主要介紹了微信小程序之前臺循環(huán)數(shù)據(jù)綁定的相關資料,這里提供實例幫助大家學習理解這部分內容，需要的朋友可以參考下2017-08-08
這篇文章主要介紹了JavaScript實現(xiàn)棧結構詳細過程，棧即stack它是一種受限的線性表，后進先出LIFO，更多具體的內容，需要的小伙伴參考下面文章的詳細內容2021-12-12
這篇文章主要為大家介紹了JS快速檢索碰撞圖形之四叉樹碰撞檢測，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-01-01
這篇文章主要為大家介紹了JS面試異步模擬紅綠燈實現(xiàn)示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2023-01-01
這篇文章主要為大家介紹了Selection與Range 對象操作示例指南，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進步，早日升職加薪2022-09-09
這篇文章主要介紹了微信小程序 合法域名校驗出錯詳解及解決辦法的相關資料,需要的朋友可以參考下2017-03-03
這篇文章主要介紹了JavaScript嚴格模式use strict，嚴格模式是JavaScript中的一種限制性更強的變種方式。嚴格模式并不是JavaScript中的子集，它在語義上與正常的代碼有明顯的差異，下面我們就一起來學習該內容吧,需要的朋友也可以參考一下2021-12-12
這篇文章主要介紹了微信小程序 框架詳解及實例應用的相關資料,需要的朋友可以參考下2016-09-09
這篇文章介紹了JS處理數(shù)據(jù)實現(xiàn)分頁功能的方法，文中通過示例代碼介紹的非常詳細。對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-01-01