121_ 뷰 axios 상세조회 후 수정하기

백엔드를 팝니다·2024년 10월 31일

개발자 수업

목록 보기
63/72

수정 버튼에 링크로 기본키 날리기

router-link :to="'/dept/' + data.dno">
span class="badge text-bg-success">수정/span>
/router-link>

=>

인덱스 경로 지정해주기

/ dno상세조회 경로 path(/dept/:dno), component (DeptDetail.vue)/
{
path: "/dept/:dno",
component: () => import("../views/basic/dept/DeptDetail.vue"),
},

=>

서비스(AXIOS)에 상세조회 함수 작성

/ 상세조회 /
//TODO: 상세조회(DNO:기본키필요)

const get = (dno) => {
return axios.get(baseURL + /basic/dept/${dno});
};

=>

페이지에 함수 코딩

import DeptService from "@/services/basic/DeptService";
export default {
data() {
return {
dept: {
dname: "",
loc: "",
},
};
},
methods: {
// 함수작성
// TODO: 상세조회
async getDetail(dno) {
try {
let response = await DeptService.get(dno);
console.log(response.data);
this.dept = response.data;
} catch (error) {
console.log(error);
}
},

//TODO: 수정
update() {},

},

mounted() {
this.getDetail(this.$route.params.dno);
},
};

        
profile
백엔드 고수가 되고싶은 사람

0개의 댓글