회원정보수정

mypage/Menu1.vue

• get(조회), post(추가), put(수정), delete(삭제)
• 조회 : await this.axios.get(url, {headers:headers});
• 추가 : await this.axios.post(url, body, {headers:headers});
• 수정 : await this.axios.put(url, body, {headers:headers});
• 삭제 : await this.axios.delete(url, {headers:headers, data:{ }});

1. async handleData();

• 토큰을 가진 사람의 정보를 불러옴

const url = `/member/selectone`;
const headers = {
  "Content-Type":"application/json",
  "token":this.token
};

: "token":this.token 헤더에 토큰 정보를 넣어서 보낸다.

• const response = await this.axios.get(url, {headers:headers});
  : 회원의 정보를 단순히 불러오는것이기 때문에 GET을 쓴다.

• response : 200 일때

if(response.data.status === 200){
  this.member = response.data.result;
  const tmp = this.member.uemail.split("@");
  // console.log('tmp =>',tmp);
  // console.log('this.member =>',this.member);
  this.member['uemail1'] = tmp[0];
  this.member['uemail2'] = tmp[1]
}

• this.member = response.data.result;
  : member에 result를 넣어주고,

• const tmp = this.member.uemail.split("@");
  : uemail 부분은 @를 기준으로 앞뒤로 나누어서 tmp라고 정의한다.
  
  : tmp는 배열의 형태로 만들어진다.

• 배열 형태의 tmp의 요소에 각각의 상태변수명을 정해서 member에 넣어준다
  : this.member['uemail1'] = tmp[0];
  : this.member['uemail2'] = tmp[1];

2. handleInfo()

• 유효성검사 이후

• heeaders에 token을 심고

• body에 uname과 uemail을 넣는다

const body = {
  uname : this.member.uname,
  // 화면디자인으로 인해 2개로 분할되어 있어서 하나로 합침  
  uemail : this.member.uemail1+"@"+this.member.uemail2
}

: uemail은 uemail : this.member.uemail1+"@"+this.member.uemail2
: '@' 도 포함해서 앞 뒤로 나눈 tmp의 요소들(= 프론트에서 사용자가 입력한 값)을 다시 합치는 형태로 한다.