Acabo de hacer una tabla para mostrar los correos electrónicos de los clientes y agregué funciones para eliminar o agregar nuevos correos electrónicos. pero para agregar la función, guardé el nuevo correo electrónico en el estado ( users ). pero no se muestra en la lista de tablas de correo electrónico. ¡La función de eliminación funciona muy bien! ¿podrían ayudarme a solucionar este problema? Acabo de adjuntar mi código

 import React, {useState} from 'react'; const Admin: NextPage = () => { const [users, setUsers] = useState([ { email: "xxxxx@xxxxx.com" }, { email: "xxxxx@xxxxx.com"}, ]); const [email, setEmail] = useState(''); const removeUser = rowEmail => { const updatedArray = users.filter((row) => row.email !== rowEmail); setUsers(updatedArray); } const addUser = () => { console.log(email); const lists = users; lists.push({'email' : email}); setUsers(lists); } return ( <> <div className="user-user"> <input type="email" onChange={event => setEmail(event.target.value)} /> <span onClick={() => addUser()}>Add User</span> </div> <div className="user-list"> <table> <thead> <tr> <th>Users</th> <th>Action</th> </tr> </thead> <tbody> {users.map((val, key) => { return ( <tr key={key}> <td>{val.email}</td> <td><span onClick={() => removeUser(val.email)}>Remove</span></td> </tr> ) })} </tbody> </table> </div> </> ); } export default Admin;