Rendering an object into a table in React

You need to return something from the .map like

const userdata = ctx.users.map((user) => {
    return (
        <tr key={user.name}>
            <td>{user.name}</td>
            <td>{user.email}</td>
            <td>{user.password}</td>
        </tr>
    )
});

Or even just

const userdata = ctx.users.map((user) => (
    <tr key={user.name}>
        <td>{user.name}</td>
        <td>{user.email}</td>
        <td>{user.password}</td>
    </tr>
));

Another option would be like

return (
    <table className="table">
        <thead>
            <tr>
                <th scope="col">Name</th>
                <th scope="col">Email</th>
                <th scope="col">Password</th>
            </tr>
        </thead>
        <tbody>
            {
                ctx.users.map((user) => (
                    <tr key={user.name}>
                        <td>{user.name}</td>
                        <td>{user.email}</td>
                        <td>{user.password}</td>
                    </tr>
                ))
            }
        </tbody>
    </table>
)

Also added the key property, since you are using an array.

Add return inside map

const userdata = ctx.users.map((user)=>{    
    return (
    <tr>
        <td>{user.name}</td>
        <td>{user.email}</td>
        <td>{user.password}</td>
    </tr>
    )
});

There are a couple of issues with your code, the main one being that the function that you use in the .map does not return anything.

Other issues:

• Missing } in the definition of ctx.
• Mismatch in property name: passwords vs password.
• No key property present in the JSX elements that are returned by the map function.

Below is a runnable sample with all these issues fixed.

function AllData() {
  const ctx = {
    users: [
      { name: 'john', email: '[email protected]', password: 'password' },
      { name: 'smith', email: '[email protected]', password: 'password' }
    ]
  };

  const userdata = ctx.users.map((user)=>{
    return (
      <tr key={user.name}>
        <td>{user.name}</td>
        <td>{user.email}</td>
        <td>{user.password}</td>
      </tr>
    )
  });

  return (
     <table className="table">
         <thead>
             <tr>
                <th scope="col">Name</th>
                <th scope="col">Email</th>
                <th scope="col">Password</th>
             </tr>
         </thead>
         <tbody>
            {userdata}
         </tbody>
     </table>
  )
}
ReactDOM.render(<AllData />, document.getElementById('react'));

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

<div id="react"></div>