欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

ionic4和ionic5创建登陆页login跳转到tabs

程序员文章站 2022-07-02 20:35:39
这是我的第一篇博客,希望我的文章能帮助到需要的朋友。近两年一直在学习ionic和Angular,ionic优点是比较容易上手,适合新手学习,可以快速创建App应用,相对于Android原生,难度降低很多,但事物总有两面性,ionic很好,但也有两个缺点,一是就是各类资料太少,很难找到需要的资料,而且各版本代码不同,基本不兼容。最近打算做一个记帐用的APP,需要在tabs之前加入一个用户登陆页面,之前也曾经给单页面做过登陆页,没有问题,但给tabs加登陆页尝试过多次,但没有成功,这次必须解决这个问题,不然...

这是我的第一篇博客,希望我的文章能帮助到需要的朋友。
近两年一直在学习ionic和Angular,ionic优点是比较容易上手,适合新手学习,可以快速创建App应用,相对于Android原生,难度降低很多,但事物总有两面性,ionic很好,但也有两个缺点,一是就是各类资料太少,很难找到需要的资料,而且各版本代码不同,基本不兼容。
最近打算做一个记帐用的APP,需要在tabs之前加入一个用户登陆页面,之前也曾经给单页面做过登陆页,没有问题,但给tabs加登陆页尝试过多次,但没有成功,这次必须解决这个问题,不然以后的设计无法进行,在网上查找资料,用各种五花八门方法,均没有成功,无法从login页到tbas页实现路由跳转,功夫不负有心人,折腾了一周后,终于找到了实现这个功能的方法。
实现起来比较简单,先新建个项目,然后五个步骤即可完成:
一、新建登陆页:
ionic g page login
二、修改app-routing.module.ts文件,将logn页面改为默认首先显示的页面,修改完成后的效果
ionic4和ionic5创建登陆页login跳转到tabs
三、login.page.ts中引入ion-router路由组件,this.router.navigateByUrl(’/tabs’);从Html中执行跳转到tabs组件
ionic4和ionic5创建登陆页login跳转到tabs

本文地址:https://blog.csdn.net/smallconch/article/details/107487269