Breaking News: Grepper is joining You.com. Read the official announcement!

react input tag value to be updated in list and need to show the list value every time it is updated

py_hacker answered on October 18, 2023 Popularity 2/10 Helpfulness 8/10

answer react input tag value to be updated in list and need to show the list value every time it is updated

react input tag value to be updated in list and need to show the list value every time it is updated

Comment

import React from 'react'
import {useEffect, useState} from 'react'

export default function TodoApp(){
    
    const [InputValue, setInputValue] = useState('');
    const [ListAdd, setListAdd] = useState([]);
    const handleInput = (e) => {
        setInputValue(e.target.value)
    }
    const handleSubmit = (e) => {
        e.preventDefault()
        setListAdd([...ListAdd,InputValue])
    }
   return(
        <div>
            <h1> TodoApp </h1>
            <form onSubmit={handleSubmit} >
                <input placeholder="Add the task" onChange={handleInput} />
                <button type="submit"> add Task </button>
            </form>

            <ul>
                {ListAdd.map((task, index) => (
                    <li key={index}>{task}</li>
                ))}
            </ul>
        </div>
    )
}

Popularity 2/10 Helpfulness 8/10 Language javascript

Source: Grepper

Tags: input javascript list show time

Link to this answer
Share Copy Link

Contributed on Oct 18 2023

py_hacker

0 Answers Avg Quality 2/10

Continue with Google

By continuing, I agree that I have read and agree to Greppers's Terms of Service and Privacy Policy.

react input tag value to be updated in list and need to show the list value every time it is updated

Contents

More Related Answers

react input tag value to be updated in list and need to show the list value every time it is updated

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.