博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
(5)ionic2--导航
阅读量:5799 次
发布时间:2019-06-18

本文共 649 字,大约阅读时间需要 2 分钟。

hot3.png

在之前的文章中,我们在ListPage类中定义了这样一个方法

itemTapped(event, item) {    console.log('You selected:', item.title);}

我们做一点改动,实现导航到新页面的功能

itemTapped(event, item) {    this.nav.push(ItemDetailsPage, {      item: item    });}

 ItemDetailsPage这个页面需要在list.js文件中引入才可以使用哦

import {ItemDetailsPage} from '../item-details/item-details';

保存之后, ionic serve 会重新编译你的app,然后载入到浏览器当中.

导航功能实现的原理;

    ionic2中的导航原理类似一个简单的堆栈.如果我们要打开一个新页面,那么这个堆栈就会把这个页面放入栈的顶端,然后显示一个返回按钮.如果我们要返回上一页,我们把这个页面从栈顶剔除.因为我们已经在构造器中创建了this.nav方法,所以在这里可以调用this.nav.push(),传入我们想要到达的页面.我们同时可以传入一个对象,这个对象包含着我们想要传递的数据..使用push()来导航到一个新页面是很简单的,于此同时你也可以自己设置导航的方法,可以google相关文档

转载于:https://my.oschina.net/boogoogle/blog/538454

你可能感兴趣的文章
hive基本操作与应用
查看>>
excel快捷键设置
查看>>
poj3692
查看>>
python之信号量【Semaphore】
查看>>
html5纲要,细谈HTML 5新增的元素
查看>>
Android应用集成支付宝接口的简化
查看>>
[分享]Ubuntu12.04安装基础教程(图文)
查看>>
[Vim] 搜索模式(正则表达式)
查看>>
#HTTP协议学习# (二)基本认证
查看>>
Android开发之线性布局详解(布局权重)
查看>>
WCF
查看>>
remoting方式
查看>>
django 目录结构修改
查看>>
win8 关闭防火墙
查看>>
Android实例-录音与回放(播放MP3)(XE8+小米2)
查看>>
CSS——(2)与标准流盒模型
查看>>
MYSQL 基本SQL语句
查看>>
C#中的Marshal
查看>>
网站发的文章有收录 但是没有排名怎么处理
查看>>
linux命令:ls
查看>>