navigator 页面链接
2024-08-31 22:34:56
页面链接。
属性名 | 类型 | 默认值 | 说明 |
---|---|---|---|
url | String | 应用内的跳转链接 | |
redirect | Boolean | false | 是否关闭当前页面 |
hover-class | String | navigator-hover | 指定点击时的样式类,当hover-class="none" 时,没有点击态效果 |
注: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="navigate?title=navigate" hover-class="navigator-hover">跳转到新页面</navigator>
<navigator url="redirect?title=redirect" redirect hover-class="other-navigator-hover">在当前页打开</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.js
Page({
onLoad: function(options) {
this.setData({
title: options.title
})
}
})
最新文章
- 卡片抽奖插件 CardShow
- Oracle索引梳理系列(六)- Oracle索引种类之函数索引
- bootstrap 组件
- RN的像素及布局
- 我最优惠网系列(1)——HTML 解析类库HtmlAgilityPack
- [bzoj1296][SCOI2009]粉刷匠(泛化背包)
- ThinkPhp之分页
- 多线程程序设计学习(5)balking模式和timed模式
- C#-禁止调整窗体的大小
- 【最短路】Vijos P1022Victoria的舞会2
- CSU 1808 地铁
- ZYSocket 4.3.5 SOCKET框架组 发布[NEW]
- 前端必知的ajax
- node.js平台下,利用cookie实现记住密码登陆(Express+Ejs+Mysql)
- Java web 学习笔记 Html CSS 小节
- Android SingleTask使用注意点
- 日常开发自己遇到异常(BUG未完待续!!!)
- 常见cmd命令,开发人员必备
- vue.js的计算机属性学习
- MPU和CPU有什么区别?