微信小程序组件navigator
导航navigator:官方文档
Demo Code:
// redirect.js navigator.js
Page({
onLoad: function(options) {
this.setData({
title: options.title
})
}
})
JS
<!-- 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>
WXML
/** wxss **/
/** 修改默认的navigator点击态 **/
.navigator-hover {
color:blue;
}
/** 自定义其他点击态样式类 **/
.other-navigator-hover {
color:red;
}
WXSS
微信小程序组件navigator的更多相关文章
- 微信小程序组件设计规范
微信小程序组件设计规范 组件化开发的思想贯穿着我开发设计过程的始终.在过去很长一段时间里,我都受益于这种思想. 组件可复用 - 减少了重复代码量 组件做为抽离的功能单元 - 方便维护 组件作为temp ...
- 微信小程序组件学习 -- 注册页面
微信小程序组件使用手册地址: 1. 百度搜索"微信公众平台",扫码登录之后,点击帮助文档里面的普通小程序. 2. 接着选择"开发"-->"组件& ...
- 详解封装微信小程序组件及小程序坑(附带解决方案)
一.序 上一篇介绍了如何从零开发微信小程序,博客园审核变智障了,每次代码都不算篇幅,好好滴一篇原创,不到3分钟从首页移出来了.这篇介绍一下组件封装和我的踩坑历程. 二.封装微信小程序可复用组件 首先模 ...
- 微信小程序——组件(二)
在上篇文章组件(一)里已经讲解了如何创建一个项目,现在继续...讲解一个页面布局以及各个组件的使用.在学习过程中,发现小程序支持flex布局,这对于学习过react native的人来说太好了,布局方 ...
- 微信小程序组件构建UI界面小练手 —— 表单登录注册微信小程序
通过微信小程序中丰富的表单组件来完成登录界面.手机快速注册界面.企业用户注册界面的微信小程序设计. 将会用到view视图容器组件.button按钮组件.image图片组件.input输入框组件.che ...
- 【腾讯Bugly干货分享】打造“微信小程序”组件化开发框架
本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2nQzsuqq7Avgs8wsRizUhw 作者:Gc ...
- 微信小程序(组件demo)以及预览方法:(小程序交流群:604788754)
1. 获取微信小程序的 AppID 登录 https://mp.weixin.qq.com ,就可以在网站的"设置"-"开发者设置"中,查看到微信小程序的 Ap ...
- 微信小程序组件通信
父子通信 在子组件的对应js中 properties:{ prop名字:数据类型, prop名字:{ type:数据类型, value:默认值 } } 在父组件的wxml模板中找到子组件标签 < ...
- 微信小程序组件化实践
Do Not Repeat Yourself 如何提高代码质量,方法有许多:抽象.模块.组件化,我认为它们的中心点都是--Do Not Repeat Yourself. 小程序组件化 我们先看看小程序 ...
随机推荐
- 【BZOJ】1636: [Usaco2007 Jan]Balanced Lineup(rmq+树状数组)
http://www.lydsy.com/JudgeOnline/problem.php?id=1636 (我是不会说我看不懂题的) 裸的rmq.. #include <cstdio> # ...
- ThinkPHP整合cropper剪裁图片上传功能
1.先下载核心文件:https://github.com/fengyuanchen/cropper 2. 3.对于index.html文件 4.对于main.js文件 5.对于crop.php文件 & ...
- 漫游Kafka实战篇之搭建Kafka运行环境(2)
接下来一步一步搭建Kafka运行环境. Step 1: 下载Kafka 点击下载最新的版本并解压. > tar -xzf kafka_2.9.2-0.8.1.1.tgz > cd kafk ...
- unity导弹算法 预计目标点
关于导弹的飞行算法,网上有很多教程.简单算法无非是获取目标点的当前位置,然后导弹朝目标方向移动.高深点的,就是通过计算获取碰撞点然后朝着目标移动.如果你能看懂这个高深算法的话,可以去看原帖:http: ...
- react-native新导航组件react-navigation详解
http://blog.csdn.net/sinat_17775997/article/details/70176688
- jquery做简单特效
1.点击触发消失效果 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> &l ...
- coderfun-boot接私活利器,文档详实,非一般的开发速度
项目主页:https://gitee.com/klguang/coderfun-boot 演示地址:http://106.15.195.9:8080/admin/项目文档:https://www.ka ...
- nexus配置第三方库文件
进入nexus管理界面 默认用户名密码:admin/admin123 在左侧Views/Repositories中选择Repositories,然后在右侧的面板中选择3rd party,在下方arti ...
- sql中字段名中包含特殊字符的查询方法
sql中字段名章包含特殊字符的查询方法:例如包含"",student表中字段为:id“学号”.name"姓名". 解决办法:用英文下的 "`" ...
- 如何让ios启动画面停留更长时间
几种方法: 方法1:在AppDelegate.m里写上 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithO ...