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

feat(vue): support for ion-tabs (#17678)

Browse Source 
* Add ion-tabs support, QOL fixes

* Fix @ionic/core version, rebuild core to include docs

* Update router

* Add support for IonTabsWillChange and IonTabsDidChange events

* Update usage docs

* Merge core and user provided click handlers in ion-tab-button

* rename file to be consistent
This commit is contained in:
Michael Tintiuc
2019-03-22 16:56:53 +02:00
committed by Mike Hartington
parent 439b10e10d
commit ee7167512f
9 changed files with 347 additions and 171 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
vue/src/controllers/vue-delegate.ts
View File

@ -1,5 +1,5 @@
import { VueConstructor, default as Vue } from 'vue';
import { FrameworkDelegate, ViewLifecycle } from '@ionic/core';
import { VueConstructor } from 'vue';
import { FrameworkDelegate, LIFECYCLE_DID_ENTER, LIFECYCLE_DID_LEAVE, LIFECYCLE_WILL_ENTER, LIFECYCLE_WILL_LEAVE, LIFECYCLE_WILL_UNLOAD } from '@ionic/core';
import { EsModule, HTMLVueElement, WebpackFunction } from '../interfaces';
@ -15,7 +15,6 @@ function createVueComponent(vue: VueConstructor, component: WebpackFunction | ob
export class VueDelegate implements FrameworkDelegate {
constructor(
public vue: VueConstructor,
public $root: Vue
) {}
// Attach the passed Vue component to DOM
@ -37,11 +36,11 @@ export class VueDelegate implements FrameworkDelegate {
componentInstance.$mount();
// Add any classes to the Vue component's root element
addClasses(componentInstance.$el, classes);
addClasses(componentInstance.$el as HTMLElement, classes);
// Append the Vue component to DOM
parentElement.appendChild(componentInstance.$el);
return componentInstance.$el;
return componentInstance.$el as HTMLElement;
});
}
@ -57,11 +56,11 @@ export class VueDelegate implements FrameworkDelegate {
}
const LIFECYCLES = [
ViewLifecycle.WillEnter,
ViewLifecycle.DidEnter,
ViewLifecycle.WillLeave,
ViewLifecycle.DidLeave,
ViewLifecycle.WillUnload
LIFECYCLE_WILL_ENTER,
LIFECYCLE_DID_ENTER,
LIFECYCLE_WILL_LEAVE,
LIFECYCLE_DID_LEAVE,
LIFECYCLE_WILL_UNLOAD
];
export function bindLifecycleEvents(instance: any, element: HTMLElement) {