Conditional Styling using ClassName in React + Classnames package explained

Поделиться
HTML-код
  • Опубликовано: 20 сен 2024
  • In this video, you will see how to have conditional styling using className in React. I have prepared a simple react template for this video and we are going to use reactjs state and conditional styling to add simple drop-down functionality to our example project.
    At the end of the video, I will show you how to use classNames npm package to handle conditional styling in a better way.
    I am waiting for your questions and feedback. Hope you learn a lot.

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

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

    So much Thanks man. I was stuck with A little bug for more than 6 hours. I just solved it man... Thank you so so much

  • @piotrszczesniak685
    @piotrszczesniak685 2 года назад +2

    Thanks for the video - nicely explained the usage of classNames :)

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

    Exactly the video I needed, thanks so much !!!

  • @holgerst3655
    @holgerst3655 3 года назад +1

    Thanks for the helpful video.

  • @rafiqjarjous7542
    @rafiqjarjous7542 3 года назад

    yep! that what i was looking for
    ty

  • @saharamanson1970
    @saharamanson1970 3 года назад

    awesome that i was looking for ...

  • @margaritopineda3490
    @margaritopineda3490 3 года назад +1

    Great help, thanks!

  • @mortezakeramat9349
    @mortezakeramat9349 9 месяцев назад

    hi Masoud thank you for teaching

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

    You're the best

  • @ianbergia5013
    @ianbergia5013 3 года назад

    Great tutorial. Thanlk you

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

    Спасибо, отличное видео! лайк)

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

    really nice

  • @jesselopez2173
    @jesselopez2173 3 года назад

    awesome.

  • @hellrtd
    @hellrtd 3 года назад

    Thanks.

  • @АльфредГордан
    @АльфредГордан 3 года назад +1

    this is cull ---- ? if not then : ---when you need to have two choices BUT if you need to have only one condition like if is true then thu this if is not don't do nothing better to use && (for example) {isSelectedForRepeat === false && (bla bla bla)}. .thanks for tuttorial

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

    Where are these files or css?

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

    What about conditional rendering CLASSNAMES following a comments.map((comment, key) => {}, e.g. show a Pink heart when you LIKE. any one of those comments you had on this video.

  • @kacperkepinski4990
    @kacperkepinski4990 3 года назад

    what is going on with isopen???????????!!!

    • @deca4553
      @deca4553 3 года назад

      isOpen gets toggled between true and false whenever onClick is triggered on title

  • @moalii7775
    @moalii7775 3 года назад

    damet garm