javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-18 19:21:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(vue): do not hide page content when using ion-page in non-routing contexts (#22302)

Browse Source 
resolves #22300
This commit is contained in:
Liam DeBeasi
2020-10-13 10:29:37 -04:00
committed by GitHub
parent 6026c65b1a
commit fff82d0bdc
3 changed files with 22 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
packages/vue/src/components/IonPage.ts
View File

@ -2,12 +2,16 @@ import { h, defineComponent } from 'vue';
export const IonPage = defineComponent({
name: 'IonPage',
setup(_, { attrs, slots }) {
props: {
isInOutlet: { type: Boolean, default: false }
},
setup(props, { attrs, slots }) {
return () => {
const hidePageClass = (props.isInOutlet) ? 'ion-page-invisible' : '';
return h(
'div',
{
['class']: 'ion-page ion-page-invisible',
['class']: `ion-page ${hidePageClass}`,
...attrs,
ref: 'ionPage'
},

2
packages/vue/src/components/IonRouterOutlet.ts
View File

@ -301,7 +301,7 @@ export const IonRouterOutlet = defineComponent({
'ion-router-outlet',
{ ref: 'ionRouterOutlet' },
// TODO types
components && components.map((c: any) => h(c.vueComponent, { key: c.pathname }))
components && components.map((c: any) => h(c.vueComponent, { key: c.pathname, isInOutlet: true }))
)
}
});