Search posts, tags, users, and pages
Can you verify that ‘t’ is an array, and nothing changes between your development env and production env relating to this?
Also if you are able to post some code (where this error happens, adminDashboard.js, around line 63) that would help us spot the problem for you :)
import React, {useState, useEffect, useContext} from 'react';
import {AppContext} from '../contexts/context';
import axios from 'axios';
import AdminNavbar from './AdminNavbar';
import UserList from './UserList';
import {RiUserSearchLine, RiAddLine} from 'react-icons/ri';
import FloatingBtn from './layouts/FloatingBtn';
import {Link} from 'react-router-dom';
const AdminDashboard = () => {
const [users, setUsers] = useState ([]);
// eslint-disable-next-line
const [isAuthenticated, setIsAuthenticated] = useContext (AppContext);
// ComponentDidMount
useEffect (() => {
async function getUsers () {
await axios
.get ('/api/users/')
.then (result => setUsers (result.data))
.catch (err => console.log (err));
}
getUsers ();
});
// Event handler
const handleDeleteUser = id => {
axios
.delete ('/api/users/delete/' + id)
.then (setUsers (users.filter (user => user.id !== id)))
.catch (err => console.log (err));
};
// Event handler
const handleLogout = () => {
setIsAuthenticated (false);
};
return (
<div>
<div className="">
<AdminNavbar />
<FloatingBtn />
<div className="container mb-3">
<Link to="/admin/user/add" className="btn btn-red text-white mb-3">
<small><RiAddLine /> Create user</small>
</Link>
</div><hr />
<div className="container">
<div>
<h5> <RiUserSearchLine size="30" /> User Database</h5>
<table className="table table-hover table-sm">
<thead>
<tr className="">
<th scope="col">First</th>
<th scope="col">Last</th>
<th scope="col">Status</th>
</tr>
</thead>
<tbody>
{users.length === 0
? 'loading'
: users.map (user => {
return (
<UserList
id={user._id}
key={user._id}
firstname={user.firstname}
lastname={user.lastname}
deleteUser={handleDeleteUser}
/>
);
})}
</tbody>
</table>
<hr />
<div className="mt-2">
<button
className="btn btn-red text-white mb-3"
onClick={handleLogout}
>
<small>Logout</small>
</button>
</div>
</div>
</div>
</div>
</div>
);
};
export default AdminDashboard;
James Erringham-Bruce that's the code for my adminDashboard. Again, there's no t.map. I really appreciate your help man
Try losing the "{ return( ); }" function at line 65, leave just the <UserList /> with it's contents. Try this:
{users.length === 0
? 'loading'
: users.map (user =>
<UserList
id={user._id}
key={user._id}
firstname={user.firstname}
lastname={user.lastname}
deleteUser={handleDeleteUser}
/>
)}
Extracting the users.map() function to a variable might help debugging.
See samples here:
Thais Ramalho THANK YOU🔥🔥🔥🔥🔥. I really appreciate🤞. I'll try it and give you a feedback
Hello Thais Ramalho , I tried that but it didn't work. PS: It works in my local machine . Thanks
Harcourt Hamsa Maybe something not correctly configured on the server? Or some error when building/deploying the code.