bug: href property on tab button required for routing despite allowing undefined

# Bug Report

**Ionic version:**

[x] **5.0.7**

**Current behavior:**

I am using an IonTabs project. In my tab bar at the bottom, I have a "Create" button that I would like to have trigger a modal on the screen. However, when I click the tab, I receive a routing error because I am not including the `href` property in the `IonTabButton`. The `href` property isn't marked as required, so I figured I could remove the `href` property since I don't want to be routed to a different page. Instead I'd like to call the `onClick` event to trigger the modal on the screen.

Obviously, it's trying to find the value of the `href` and errors on the `split`.

Repo to replicate: https://github.com/uncvrd/tabs-as-buttons (I only modified the App.tsx)

Steps to recreate:
1. Ionic Serve
2. Click the "Create" tab at the bottom of the page

I would like to be able to use the `IonTabButton` as a normal button if the `href` is not added as a property.

Stack trace here:

```
×
TypeError: Cannot read property 'split' of undefined
IonRouterInner.handleChangeTab
src/ReactRouter/IonRouter.tsx:78
75 |
76 | handleChangeTab(tab: string, path: string, routeOptions?: any) {
77 | const routeInfo = this.locationHistory.getCurrentRouteInfoForTab(tab);
> 78 | const [pathname, search] = path.split('?');
| ^ 79 | if (routeInfo) {
80 | this.incomingRouteParams = { ...routeInfo, routeAction: 'push', routeDirection: 'none' };
81 | if (routeInfo.pathname === pathname) {
View compiled
IonTabBarUnwrapped.onTabButtonClick
src/components/navigation/IonTabBar.tsx:178
175 | this.props.onIonTabsDidChange(new CustomEvent('ionTabDidChange', { detail: { tab: e.detail.tab } }));
176 | }
177 | this.setActiveTabOnContext(e.detail.tab);
> 178 | this.context.changeTab(e.detail.tab, currentHref, e.detail.routeOptions);
| ^ 179 | }
180 | }
181 |
View compiled
IonTabButton.handleIonTabButtonClick
src/components/navigation/IonTabButton.tsx:23
20 |
21 | handleIonTabButtonClick() {
22 | if (this.props.onClick) {
> 23 | this.props.onClick(new CustomEvent('ionTabButtonClick', {
| ^ 24 | detail: { tab: this.props.tab, href: this.props.href, routeOptions: this.props.routerOptions }
25 | }));
26 | }
View compiled
HTMLElement.handler
src/components/utils/attachProps.ts:91
88 |
89 | // Bind new listener.
90 | node.addEventListener(eventName, eventStore[eventName] = function handler(e: Event) {
> 91 | if (newEventHandler) { newEventHandler.call(this, e); }
92 | });
93 | };
94 |
View compiled
```

**Ionic info:**

```
Ionic:

Ionic CLI : 6.7.0 (/usr/local/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/react 5.4.1

Capacitor:

Capacitor CLI : 2.4.2
@capacitor/core : 2.4.2

Utility:

cordova-res (update available: 0.15.1) : 0.14.0
native-run (update available: 1.2.2) : 1.0.0

System:

NodeJS : v12.16.2 (/usr/local/bin/node)
npm : 6.14.4
OS : macOS Catalina
```

Reproduce the missing-href tab behavior in the linked tabs-as-buttons repository, then read src/ReactRouter/IonRouter.tsx, src/components/navigation/IonTabBar.tsx, and src/components/navigation/IonTabButton.tsx around the stack-trace locations. Verify that an IonTabButton without href can invoke its onClick handler for the modal without causing the undefined split error.

Written by the indexing model from the issue text.