Building an Ionic React Side Menu Navigation

Поделиться
HTML-код
  • Опубликовано: 20 янв 2025

Комментарии • 21

  • @galaxies_dev
    @galaxies_dev  Год назад

    Learn to build epic IONIC apps FAST by joining the Ionic Academy: ionicacademy.com/

  • @freezzefx2670
    @freezzefx2670 2 года назад

    what is your visual studio code theme ?

  • @ronansibunga8148
    @ronansibunga8148 2 года назад

    Hi simon..can you show us how to render different icons when active tab is selected on ionic react.. that one that you have was in angular (cloning youtbe ui) thanks in advance.

    • @galaxies_dev
      @galaxies_dev  2 года назад

      Will try so Ronan!

    • @galaxies_dev
      @galaxies_dev  2 года назад

      Actually it's pretty easy, you can use a function when the tab updates and then simply set a different icon or make the icon on the tab conditional.. However, this is the piece to listen for changes: didChange(tab)}>

  • @Apuscus
    @Apuscus Год назад

    Hi Simon, and thank you for your helpful awsome videos!
    i'm struggling with some issue, when i want to set an interval inside only one of the pages that we can navigated from the menu. let's say i've initialise an interval function inside "page 1", a function that do console.log("hi") every 2 seconds. let's say i achieved that with "useEffect" with a cleanup function that suppose to clean the interval when i exit that component (unmount). i've noticed that when i navigated between the pages, page 1 and page 2 back and forth, the interval KEEP running. my desire is to set an interval that run ONLY in page 1 but stop/destroyed once i navigate to page 2. i think it's related to the fact that these pages (page 1 and 2) are NOT unmounted when i switch between them in the menu bar? thanks!

    • @galaxies_dev
      @galaxies_dev  Год назад

      Yes they are kept in memory, but you could use the lifecycle events of Ionic to see when a view leaves the screen: ionicframework.com/docs/v5/react/lifecycle

  • @worldbest3097
    @worldbest3097 2 года назад

    are there any tips for using nextjs? i mean if i want to use common layout for multiple pages, then how can i mingle ionic content and such as tailwindcss layout with flex or grid. in conclusion, want to make reusable component for pages

    • @galaxies_dev
      @galaxies_dev  2 года назад +1

      If you want everything ion one project it might really become a mess if you combine different components and styling libraries. I haven't found the perfect solution for that yet!

    • @worldbest3097
      @worldbest3097 2 года назад

      @@galaxies_dev oh yeah thx for replying!

  • @PrPauloNova
    @PrPauloNova 2 года назад

    Hi Simon! I am having problems with the Menu.. Can you help me?
    1- Warning: You should not use and in the same route; will be ignored
    2- split pane does not have a specified main node
    3- Menu: must have a "content" element to listen for drag events on.

    • @galaxies_dev
      @galaxies_dev  2 года назад

      It sounds like you forgot to add "contentId" to the IonSplitPane and IonMenu? Also, the IonRouterOutlet needs to have the same "id"!

  • @KushalDiwakar
    @KushalDiwakar 2 года назад

    JSX element class does not support attributes because it does not have a 'props' property.
    how to resolve this error please tell me

  • @SalvaToroTorus
    @SalvaToroTorus Год назад

    The toolbar is the same among navigations and as it can be seen it is also animated: ruclips.net/user/clipUgkxRzNbslQtxWCvSq1On-0L3VdiwM87dbul
    How can we exclude the toolbar from the navigation transition? When using a menu the toolbar must be a child of the IonPage so I dont know if it is possible.
    Thanks

  • @round8four
    @round8four 10 месяцев назад

    Hi create q hybrid app isong ionic framework and react js please

  • @NitinKanade
    @NitinKanade 2 года назад +1

    Nice

  • @round8four
    @round8four 10 месяцев назад

    Great

  • @Drenger77
    @Drenger77 Год назад

    useIonRouter do not exist