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 ...
随机推荐
- Vue之Vuex
一.什么是vuex Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化.简单来说就是一个数据统一 ...
- CCNP第一课:默认路由(路由黑洞,路由终结)
一:功能实现 R1的环回口由R3控制下放,下放之后R4才可以ping通 代码: R1: 只需要一条静态路由,能回包就行了 ip route 20.1.1.0 255.255.255.0 10.1.1. ...
- 初码-Azure系列-如何在控制面板中选择中文版操作系统
之前在文章<初码-Azure系列-记一次从阿里云到Azure的迁移和部署>中说到,默认的Windows Server 2016操作系统是英文版,后来摸索出中文版的方法,如下:
- Eclipse导入项目常见问题----服务器版本问题02
*有时导入项目时,我们打开build时会看到服务器包上有一个红色的×,和这里JRE System jar包显示的是一个样的,左侧有个红色叉: 解决办法 打开到如下界面,解决步骤如下图: 打开该界面方式 ...
- MySql俩种分页区别(注意)
注意俩个分页的区别哦~ SELECT * FROM city LIMIT 2 OFFSET 1; 从第二条记录开始 取二条记录 如下: SELECT * FROM city LIMIT 3,2; 从第 ...
- 提高java编程质量 - (二)取余用偶判断,不要用奇判断
取余判断原则:取余用偶判断,不要用奇判断 先看一个 程序: package com.test; import java.util.Scanner; public class t1 { public s ...
- oracle中的function的简单语法定义
1. create or replace 函数名 (参数名 in 类型) return 返回值类型 as 定义变量 begin 函数体 end;
- homebrew & brew cask使用技巧及Mac软件安装
homebrew 安装 /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/m ...
- vue 高德地图之玩转周边
前言:在之前的博客中,有成功引入高德地图,这是以前的地址 vue 调用高德地图. 因为一些需求,需要使用到地图的周边功能. 完整的项目代码请查看 我的github 一 .先看要实现的结果,参考了链 ...
- TypeScript技巧集锦(陆续更新)
在C++项目中编译TypeScript(以下简称ts) 编辑ts文件的属性,项类型选择"自定义生产工具". 命令行输入tsc所在位置与编译参数,我的是"C:\Progra ...