React JS update ARRAY of OBJECTS in state 🚘

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

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

  • @BroCodez
    @BroCodez  Год назад +9

    import React, { useState } from 'react';
    function MyComponent() {
    const [cars, setCars] = useState([]);
    const [carYear, setCarYear] = useState(new Date().getFullYear());
    const [carMake, setCarMake] = useState("");
    const [carModel, setCarModel] = useState("");
    function handleAddCar(){
    const newCar = {year: carYear,
    make: carMake,
    model: carModel};
    setCars(c => [...c, newCar]);
    setCarYear(new Date().getFullYear());
    setCarMake("");
    setCarModel("");
    }
    function handleRemoveCar(index){
    setCars(c => c.filter((_, i) => i !== index));
    }
    function handleYearChange(event){
    setCarYear(event.target.value);
    }
    function handleMakeChange(event){
    setCarMake(event.target.value);
    }
    function handleModelChange(event){
    setCarModel(event.target.value);
    }
    return (
    List of Car Objects

    {cars.map((car, index) =>
    handleRemoveCar(index)}>
    {car.year} {car.make} {car.model}
    )}




    Add Car
    );
    }
    export default MyComponent;

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

      please explain lifecycle methode plz

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

      Teacher, Could you teach . Net Programming C# windows form App?

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

      1:39 1:41 1:41 1:42 1:43 1:43 1:43 1:43 1:44 1:44 1:44 1:44 1:44

  • @minsoojo8787
    @minsoojo8787 Год назад +3

    Thanks for all the great videos, they've helped me a lot, and still do, whenever I'm trying to learn anything coding related!
    Any plans in the future for Redux?

  • @xzex2609
    @xzex2609 11 месяцев назад

    Bro if you were lazy , you certainly use (ALT + SHIFT + (up/down) Arrow key to copy the line you are in ( without selecting and copy and paste) and if you select a bunch of lines it will copy ( up or down another one

  • @rishabhkedia9304
    @rishabhkedia9304 11 месяцев назад

    Please make Reactjs projects as well

  • @otabekmadaminov-z2i
    @otabekmadaminov-z2i 3 месяца назад

    Thank you very much bro

  • @qazizarifulislam6568
    @qazizarifulislam6568 Год назад +3

    But should we sit back and relax

  • @recursion.
    @recursion. Год назад

    Hi Bro, could you please make a video on "why react?" I still have no clue why people use react.

  • @The_Man..
    @The_Man.. 8 месяцев назад

    Hello bro, i've been struggling with this stuff for a while now,
    can you make a video or explain here how can i edit and update the properties of an object that is inside of an useState array, thank you so much man, hope this comment reaches to you..

  • @Akash-xv5sk
    @Akash-xv5sk 10 месяцев назад

    npm run dev -- --host 0.0.0.0 --port 5173 is not working in the mobile do you have idea? Connected into same Router.

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

    Cool

  • @idontknowwhattonamethischa4592
    @idontknowwhattonamethischa4592 Год назад +1

    Noice video

  • @bitwise4996
    @bitwise4996 4 месяца назад

    my carYear variable returned 2024 What do I do?

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

    Hi BroCode
    can you explain me the logic for how the element got removed
    function handleRemoveCar(index){
    setCars(c => c.filter((_, i) => i !== index));
    }
    I did not understand ( i !== index) part ??

    • @shtabesh02
      @shtabesh02 Год назад +6

      You need to focus on filter method. It returns an array of all the elements that meet the condition. And here it returns all other elements except the one whose index equals the 'given' index.
      That means we do not remove anything. But create a new array ignoring the one whose index equals the given index which is passed as the parameter of the function.

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

    dearest bro, would you start a discord bro code community? I can set it up if you dont have the time

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

    Bro how many coding languages you know

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

    Wassup

  • @l213dhanesh3
    @l213dhanesh3 Год назад +1

    Code bro what are u doing

  • @pastori2672
    @pastori2672 Год назад +1

    Who's watching this in 2024 too 👇

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

    Hey bro, could you please make a Visual Studio Code 22 full course tutorial?