79310498

Date: 2024-12-26 21:56:00
Score: 1
Natty:
Report link
import React, { useState } from 'react';  
    
const UserForm = () => {  
    const [users, setUsers] = useState([]);  
    const addUser = () => {  
        setUsers([...users, { name: '', image: null }]);
    };  
    
    const handleImageUpload = (e) => {  
        const file = e.target.files[0];
        if (!file) return;
    
        setUsers((prevUsers) =>  
          prevUsers.map((user, index) =>   
            index === prevUsers.length - 1 
              ? { ...user, image: file }
              : user
          )  
        );  
      };  
    return (  
        <div>  
          <button onClick={addUser}>Add User</button>  
          {users.map((user, index) => (  
            <div key={index}>  
              <input type="file" accept="image/*" onChange={handleImageUpload} />  
              {user.image && <img src={URL.createObjectURL(user.image)} alt={`User ${index}`} />}  
            </div>  
          ))}  
        </div>  
    );  
};  
    
export default UserForm;  

Please try with this. Hope you any help. Thanks.

Reasons:
  • Blacklisted phrase (0.5): Thanks
  • Blacklisted phrase (1): any help
  • Long answer (-1):
  • Has code block (-0.5):
  • Low reputation (1):
Posted by: Amirul Aziz