➜ UserAll mostrar usuarios

Componente UserAll en React JS | Implementación del componente para mostrar todos los usuarios con el rol client que se han registrado en el directorio de empresas

CRUD UserAll()

App.jsx

<Route path='user' element={<UserAll/>} />

Config.jsx

// ROL ADMIN
    getUserAll:()=>axios.get(`${base_api_url}/admin/user`),

pageadmin/UserAll.jsx

import React, { useEffect, useState } from 'react'
import Sidebar from './Sidebar'
import Config from '../Config'
import { Link } from 'react-router-dom'

const UserAll = () => {

    const [users, setUsers] = useState([])

    useEffect(()=>{
        getUserAll();
    },[]);

    const getUserAll = async ()=>{
        const response = await Config.getUserAll()        
        setUsers(response.data)
    }


  return (
    <div className="container bg-light">
        <div className='row'>
        <Sidebar/>
        <div className="col-sm-9 mt-3 mb-3">
            <div className="card">
                <div className="card-body">
                    <table className='table'>
                        <thead>
                            <tr>
                            <th>ID</th><th>NAME</th><th>ACCIÓN</th>
                            </tr>
                        </thead>
                        <tbody>
                            {
                                !users ? "...loading " : users.map(
                                    (user)=>{
                                        return(
                                            <tr key={user.id}>
                                                <td>{user.id}</td>
                                                <td>{user.name}</td>
                                                <td>
                                                    <Link to={`/admin/user/edit/${user.id}`} className='btn btn-primary'>Editar</Link>
                                                </td>
                                            </tr>
                                            
                                        )
                                    }
                                )
                            }                            
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
    </div>
  )
}

export default UserAll

1080 visitas

Capítulo 20 – UserUpdate Aprobación del usuario »

{ Curso ReactJS y Laravel Directorio de Empresas }

Compartir link con tus amigos

Descarga el código del proyecto

Descarga el código fuente del proyecto adquiriendo el curso completo

Comprar

➜ UserAll mostrar usuarios

Descarga el código del proyecto

¡Qué aprenderás?