리액트 node 서버 연결(4)

노드에서 보낸 sql 데이터바인딩

import axios from 'axios';
import { useEffect, useState } from 'react';
import Table from 'react-bootstrap/Table';

export default function EmpList() {
  let [empList, setEmpList] = useState([]);

  useEffect(() => {
    axios.get('http://127.0.0.1:8000/') //axios는 결과값이 객체로 전송
      .then((res) => setEmpList(res.data))
      .catch((err) => console.log(`에러 -> ${err}`));

  }, [])

  return (
    <>
      <br /><h2>Employee</h2><br />
      <Table striped bordered hover>
        <thead>
          <tr>
            <th>번호</th>
            <th>사원아이디</th>
            <th>사원명</th>
            <th>입사일</th>
            <th>부서</th>
            <th>폰번호</th>
            <th>이메일</th>
          </tr>
        </thead>
        <tbody>
          {empList.map((v, i) =>
            <tr>
              <td>{v.rno}</td>
              <td>{v.emp_id}</td>
              <td>{v.emp_name}</td>
              <td>{v.hire_date}</td>
              <td>{v.dept_id}</td>
              <td>{v.phone}</td>
              <td>{v.email}</td>
            </tr>
          )}
        </tbody>
      </Table>
    </>
  );
}