React JS update ARRAY of OBJECTS in state 🚘

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

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

  • @BroCodez
    @BroCodez  11 месяцев назад +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 11 месяцев назад

      please explain lifecycle methode plz

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

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

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

      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 11 месяцев назад +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 10 месяцев назад

    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

  • @qazizarifulislam6568
    @qazizarifulislam6568 11 месяцев назад +3

    But should we sit back and relax

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

    Please make Reactjs projects as well

  • @idontknowwhattonamethischa4592
    @idontknowwhattonamethischa4592 11 месяцев назад +1

    Noice video

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

    Thank you very much bro

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

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

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

    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..

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

    Cool

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

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

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

    my carYear variable returned 2024 What do I do?

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

    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 11 месяцев назад +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 11 месяцев назад

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

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

    Bro how many coding languages you know

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

    Wassup

  • @l213dhanesh3
    @l213dhanesh3 11 месяцев назад +1

    Code bro what are u doing

  • @pastori2672
    @pastori2672 11 месяцев назад +1

    Who's watching this in 2024 too 👇

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

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