vue nuxt path param 변경하기

vue nuxt path param

 

라우터 구조

/survey/:id/question/:questionId

 

문제상황

/survey/58/question/1 -> /survey/58/question/2 으로 라우터가 넘어가야한다.

 

시도

우선은 nuxt 에서 path param 이 있을 시 자동으로 route name 이 "survey-id-question-questionNumber" 이런식으로 만들어진다고 한다. (참조 https://nuxtjs.org/docs/features/file-system-routing/)

따라서 일부 path parameter 변경 시에 split('/') 사용할 필요 없이 다음과 같이 할 수 있다.

const pathParam = { ...this.$route.params, questionNumber: this.questionNumber++ };
this.$router.push({
  name: 'survey-id-question-questionNumber',
  pathParam,
});