Skip to content

bug: angular/react/vue, cannot set query param on tab buttons #25470

Open
@gooddaddy

Description

@gooddaddy

Prerequisites

Ionic Framework Version

  • v4.x
  • v5.x
  • v6.x
  • Nightly

Current Behavior

<IonTabButton
              key={item.tab}
              tab={item.tab}
              href='/a?search=1'
              className={styles.tabButton}
            >
              <NavIcon selected={!!selected} icon={item} />
              <IonLabel>{item.label}</IonLabel>
            </IonTabButton>

'search will not be in location's href

Expected Behavior

'search' will be in location's href

Steps to Reproduce

<IonTabs>
      <IonRouterOutlet id="tabs">   
       <Route  exact={exact} path='/a' render={() => <UComponent />} />
     </IonRouterOutlet>
        <IonTabButton
              key={item.tab}
              tab={item.tab}
              href='/a?search=1'
              className={styles.tabButton}
            >
              <NavIcon selected={!!selected} icon={item} />
              <IonLabel>{item.label}</IonLabel>
    </IonTabButton>
   </IonTabBar>
</IonTabs>

Code Reproduction URL

No response

Ionic Info

Ionic:

Ionic CLI : 6.19.1

Utility:

cordova-res : not installed globally
native-run : not installed globally

System:

NodeJS : v16.14.2
npm : 8.5.0
OS : macOS Big Sur

Additional Information

企业微信截图_638f61fc-855c-44eb-85bb-781e00e76479

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions