ModusCreateOrg / ionic-vue

Vuejs integration for Ionic versions 4 and 5
MIT License
272 stars 26 forks source link

Allow ion-tab-button with undefined "tab" property to do nothing. #102

Closed mattsteve closed 4 years ago

mattsteve commented 4 years ago

Right now if you don't specify the "tab" property on an ion-tab-button it defaults to "/" in @modus/ionic-vue, whereas the original component in @ionic/core simply does nothing.

This "doing nothing" behavior is required for adding a custom click event handler to tab buttons that doesn't involve redirecting the page. When using this library it's impossible to make an ion-tab-button do something custom like open a modal instead of route to a page.

My suggestion is here: https://github.com/ModusCreateOrg/ionic-vue/blob/master/src/components/navigation/ion-tabs.ts#L137

If (child.elm as HTMLIonTabButtonElement).tab doesn't exist, simply return; do nothing.

michaeltintiuc commented 4 years ago

@mattsteve When setting custom click handlers, the default one is being triggered as well, isn't it? Also, could you link the @ionic/core code you referenced?

mattsteve commented 4 years ago

Tab prop is checked to be defined before emitting the click event.

https://github.com/ionic-team/ionic/blob/master/core/src/components/tab-button/tab-button.tsx#L90

michaeltintiuc commented 4 years ago

@mattsteve see the PR

mattsteve commented 4 years ago

Looks good to me.