Keep track of the active/selected ion tab in Ionic React (Ionic Framework)
Sometimes we may want to figure out and keep track of which IonTabButton is selected or 'active' in Ionic Framework mobile apps. This can open up a wealth of opportunities for increasing UX and improving our UI with little tricks.
In this video, I show you how to implement this and find the selected or active tab button in your app by utilizing the onIonTabsWillChange and setting the selected tab into state then using this to display some UI.
#############################
🔗 Ionic Discord
https://t.co/V01uGCG4Q8
🎉 Reach out to me
/ 93alan
💙 UI Examples with Code and Live Demos
https://ionicreacthub.com
#############################
00:00 Introduction
00:46 Code tutorial
01:00 Prerequisite video
01:35 Setting up state variable for initial tab
02:09 Tab name explained
02:47 onIonTabsWillChange
03:00 Capturing the selected tab
03:32 Boolean to check if selected
04:19 Change color of icon based on selected
05:05 Change the icon based on selected
06:18 Outro
#ionic #capacitor #webnative #react #reactjs #ionicreact