Info.js 1.56 KB
Newer Older
이재연's avatar
aa    
이재연 committed
1
import userApi from "../../apis/user.api";
이재연's avatar
오잉    
이재연 committed
2
import { useEffect, useState } from "react";
이재연's avatar
aa    
이재연 committed
3

이재연's avatar
오잉    
이재연 committed
4
5
6
7
8
9
10
const userprofile = localStorage.getItem("user");
const INIT_PROFILE = {
  name: "",
  email: "a",
  id: "",
  phone: "",
};
이재연's avatar
aa    
이재연 committed
11

이재연's avatar
오잉    
이재연 committed
12
13
const Info = () => {
  const [profile, setProfile] = useState(INIT_PROFILE);
이재연's avatar
aa    
이재연 committed
14

이재연's avatar
오잉    
이재연 committed
15
16
  async function getProfile(userID) {
    try {
이재연's avatar
이재연 committed
17
      const data = await userApi.getUser(userID);
이재연's avatar
오잉    
이재연 committed
18
19
20
21
22
23
      setProfile(data);
    } catch (error) {}
  }
  useEffect(() => {
    getProfile(userprofile);
  }, [userprofile]);
이재연's avatar
이재연 committed
24
25

  return (
이재연's avatar
오잉    
이재연 committed
26
    
이재연's avatar
이재연 committed
27
    <div className="container" style={{ background: "#FCF4FF" }}>
이재연's avatar
오잉    
이재연 committed
28
      
이재연's avatar
이재연 committed
29
      <div
이재연's avatar
이재연 committed
30
        className="row justify-content-center  my-4"
이재연's avatar
이재연 committed
31
32
        style={{ fontSize: "25px", fontWeight: "bold" }}
      >
이재연's avatar
오잉    
이재연 committed
33
        {profile.email} #{profile.id}
이재연's avatar
이재연 committed
34
35
36
      </div>
      <div className="row">
        <div className="col-3"></div>
이재연's avatar
이재연 committed
37
        <div className="col-6 my-2">
이재연's avatar
이재연 committed
38
39
40
          <h2 className="mb-3" style={{ fontSize: "13px", fontWeight: "bold" }}>
            이름
          </h2>
이재연's avatar
오잉    
이재연 committed
41
42
43
44
45
46
          <h2
            className="mb-4 mt-2"
            style={{ fontSize: "25px", fontWeight: "bold" }}
          >
            {profile.name}
          </h2>
이재연's avatar
이재연 committed
47
48
49
50
51
52
          <h2
            className="mb-3 mt-2"
            style={{ fontSize: "13px", fontWeight: "bold" }}
          >
            전화번호
          </h2>
이재연's avatar
오잉    
이재연 committed
53
54
55
56
57
58
          <h2
            className="mb-3 mt-2"
            style={{ fontSize: "25px", fontWeight: "bold" }}
          >
            {profile.phone}
          </h2>
Kim, Chaerin's avatar
Kim, Chaerin committed
59
        </div>
이재연's avatar
이재연 committed
60
61
62
63
        <div className="col"></div>
      </div>
    </div>
  );
Kim, Chaerin's avatar
Kim, Chaerin committed
64
65
66
};

export default Info;