ionic-team / ionic-team/ionic-framework
bug: Missing navigation animations when navigating from tabs
还没有人认领这个 Issue。
- 主要语言
- TypeScript
- 星标
- 52.7k
- 派生
- 13.3k
- 平均合并
- 1 天 14 小时
- 30 天内合并 PR
- 50
描述
Bug Report
Navigating forward from a tab page to another sub-page will not show the router transition animation if the sub-page is listed inside the tabs.router.module.ts
Ionic version:
[x] 4.6
Current behavior:
In my application I wanna show the tabs all the time also on sub pages. To react this case I have to list my subpages inside the tabs.router.module.ts file.
If I navigate now from Tab1 to Page1, there will be no router transition animation and the back button usage is not that intuitive anymore.
Expected behavior:
It should be possible to navigate from tabs to pages listed as subpages inside the tabs.router.module.ts file with router transition animations and back button support oob.
Steps to reproduce:
- Create an new tabs project
- Create a empty page
- Add the page as a sub page inside the
tabs.router.module.tsfile - Navigate
forwardto the child page
Related code:
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { TabsPage } from './tabs.page';
const routes: Routes = [
{
path: 'tabs',
component: TabsPage,
children: [
{
path: 'tabDatesRoot',
children: [
{
path: '',
loadChildren: '../pages/dates/dates.module#DatesPageModule'
}
]
},
{
path: '',
redirectTo: '/tabs/tabDatesRoot',
pathMatch: 'full'
},
{
path: 'pages',
children: [
{ path: 'map', loadChildren: '../pages/map/map.module#MapPageModule' },
]
}
]
},
{
path: '',
redirectTo: '/tabs/tabDatesRoot',
pathMatch: 'full'
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class TabsPageRoutingModule {}
Ionic info:
Ionic:
Ionic CLI : 5.2.3 (/Users/danielsogl/.nvm/versions/node/v12.4.0/lib/node_modules/ionic)
Ionic Framework : @ionic/angular 4.6.2
@angular-devkit/build-angular : 0.13.9
@angular-devkit/schematics : 7.3.9
@angular/cli : 7.3.9
@ionic/angular-toolkit : 1.5.1
Capacitor:
Capacitor CLI : 1.1.1
@capacitor/core : 1.1.1
Utility:
cordova-res : not installed
native-run : not installed
System:
NodeJS : v12.4.0 (/Users/danielsogl/.nvm/versions/node/v12.4.0/bin/node)
npm : 6.10.1
OS : macOS Mojave```
贡献指南
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
调研方向
创建一个新的 Ionic tabs 项目,按照所示的路由结构在 tabs.router.module.ts 中添加一个空的子页面,并复现从一个 tab 进行前向导航。检查 tab 的子路由和 router 的过渡行为;当导航到子页面时显示过渡动画,并为返回按钮提供直观的支持,即表示完成。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- angular, typescript
- 领域
- frontend, mobile
- Issue 类型
- 缺陷
- 难度
- 4/5
- 预计耗时
- 3-5 天
- 活跃度
- 停滞
- 描述清晰度
- 基本清楚
- 新手友好度
- 25/100