ionic 最简单的路由形式,头部固定,下面tab切换-------一个简单的单页切换起飞了
<ion-header-bar class="bar-dark" align-title="left">
<h1 class="title" >微信 </h1>
<span class="button button-clear">
<i class="icon ion-plus padding-right"></i>
<i class="icon ion-search padding-left"></i>
</span>
</ion-header-bar>
<ion-tabs class="tabs-positive tabs-striped tabs-bottom tabs-icon-top">
<ion-tab title="微信" icon-on="ion-ios-filing" icon-off="ion-ios-filing-outline">
<ion-view>
<ion-content class="calm-bg">
<ul class="list">
<li class="item item-avatar-left" ng-repeat="item in items">
<img src="wxl.jpg" style="height: 40px;width: 40px;"/>
<h2 class="list-inset">忙里偷闲</h2>
<p class="padding-top">{{item}}你在忙什么啊,稍后回复您的消息</p>
<h3 class="badge">{{ date | date : 'a h:mm' }}</h3>
</li>
</ul>
</ion-content>
</ion-view>
</ion-tab>
<ion-tab title="通讯录">
<ion-view>
<ion-content class="bar-dark">
<ul class="list">
<li class="item item-avatar-left" ng-repeat="item in items">
<img src="wxl.jpg" style="height: 40px;width: 40px;"/>
<p class="padding-top">{{item}}你在忙什么啊,稍后回复您的消息</p>
</li>
</ul>
</ion-content>
</ion-view>
</ion-tab>
<ion-tab title="发现">
<ion-view>
<ion-content class="bar-dark">
内容三
</ion-content>
</ion-view>
</ion-tab>
<ion-tab title="我">
<ion-view>
<ion-content class="bar-dark">
内容四
</ion-content>
</ion-view>
</ion-tab>
</ion-tabs>

ionic 最简单的路由形式,头部固定,下面tab切换-------一个简单的单页切换起飞了的更多相关文章
- vuex存取token,http简单封装、模拟登入权限校验操作、路由懒加载的几种方式、vue单页设置title
1.config index.js下面的跨域代理设置: proxyTable: { '/api': { target: 'http://xxxx', //要访问的后端接口 changeOrigin: ...
- 手把手教你用vue-cli构建一个简单的路由应用
上一章说道:十分钟上手-搭建vue开发环境(新手教程)https://www.jianshu.com/p/0c6678671635 开发环境搭建好之后,那么开始新添加一些页面,构建最基本的vue项目, ...
- ASP.NET Core Web API下事件驱动型架构的实现(一):一个简单的实现
很长一段时间以来,我都在思考如何在ASP.NET Core的框架下,实现一套完整的事件驱动型架构.这个问题看上去有点大,其实主要目标是为了实现一个基于ASP.NET Core的微服务,它能够非常简单地 ...
- 我们为之奋斗过的C#-----C#的一个简单理解
我们首先来简单叙述一下什么是.NET,以及C#的一个简单理解和他们俩的一个区别. 1 .NET概述 .NET是Microsoft.NET的简称,是基于Windows平台的一种技术.它包含了能在.NET ...
- (转)Web Service入门简介(一个简单的WebService示例)
Web Service入门简介 一.Web Service简介 1.1.Web Service基本概念 Web Service也叫XML Web Service WebService是一种可以接收从I ...
- laravel 实现一个简单的 RESTful API
创建一个 Article 资源 php artisan make:resource Article 你可以在 app/Http/Resources 目录下看到你刚刚生成的 Article 资源 当然我 ...
- Web Service入门简介(一个简单的WebService示例)
Web Service入门简介 一.Web Service简介 1.1.Web Service基本概念 Web Service也叫XML Web Service WebService是一种可以接收从I ...
- 一个简单的java僵局演示示例
在实际编程,为了避免死锁情况,但是,让你写一个有用的程序死锁似几乎不要太简单(种面试题),下面是一个简单的死锁样例. 线程的同步化可能会造成死锁,死锁发生在两个线程相互持有对方正在等待的东西(实际是两 ...
- 使用RStudio学习一个简单神经网络
数据准备 1.收集数据 UC Irvine Machine Learning Repository-Concrete Compressive Strength Data Set 把下载到的Concre ...
随机推荐
- JAVA POI 应用系列(2)--读取Excel
添加maven依赖 <dependency> <groupId>org.apache.poi</groupId> <artifactId>poi< ...
- jquery+js实现鼠标位移放大镜效果
jQuery实现仿某东商品详情页放大镜效果 用jquery+js实现放大镜效果,效果大概如下图! 效果是不是大家很感兴趣,放大镜查看细节,下边大家可以详细看一看具体是怎么实现的.下边直接看代码! HT ...
- leetcode算法题(JavaScript实现)
题外话 刷了一段时间的codewars的JavaScript题目之后,它给我最大的感受就是,会帮助你迅速的提升你希望练习的语言的API的熟悉程度,Array对象.String对象等原生方法,构造函数. ...
- PHP 获取系统信息,PHP 获取服务器详细信息
获取系统类型及版本号: php_uname() (例:Windows NT COMPUTER 5.1 build 2600)只 ...
- linux系统必学-部分链接
vi操作笔记 vim操作笔记 好网站,临时收藏 SEO十万个为什么 9RIA.com天地会--中国最大的专业Flash论坛 ===互联网=============================== ...
- iHover – 30+ 纯 CSS3 实现的超炫的图片悬停特效
iHover 是一个令人印象深刻的图片悬停效果集合,完全基于 CSS3 实现,无依赖,能够搭配 Bootstrap 3 很好地工作.基于 SCSS 技术构建(包括文件),便于修改变量.有模块化的代码, ...
- wap网站的优化建设
我们在成功建立wap网站之后,不要觉得一时没有达到自己想要的效果就丢之气之,让其成为垃圾链接,我们既然前期做了大量的工作来建立起来这个网站,一定要坚持耐心的把这个网站培养下去,其实就如同我们栽种一个树 ...
- asp.net core 教程(六)-中间件
Asp.Net Core-中间件 在这一章,我们将了解如何设置中间件.中间件技术在 ASP.NET Core中控制我们的应用程序如何响应 HTTP 请求.它还可以控制应用程序的异常错误,这是一个在如何 ...
- Shiro眼皮下玩ajax,玩出302 Found(实践得经验)
2017/06/14这一天,是我玩Shiro安全框架最刻骨铭心的一天.因为Shiro今天给我深深的补了一刀,在这儿我也给各位补一刀吧,其实问题很简单,解决方式也极其简单,只是给各位分享一下这个错误,纯 ...
- Web设计思想——渐进增强
最近在拜读一本Web体验相关的书<渐进增强--跨平台用户体验设计 >,阅读后做些总结,消化一下书中的精髓. 在阅读本文前,可以先思考下面几个问题. 1. 浏览网页的目的是什么? 2. 浏览 ...