얻기 라우터 PARAMS

Question

그래서 같은 큰 형태로 모든 단일 액션을 가져올 필요없이, Vuex 작업에 라우터 PARAMS을 통과 싶습니다

edit_sport_type({ rootState, state, commit }, event) { 
    const sportName = rootState.route.params.sportName <------- 
    const payload = {sportName, event}     <------- 
    commit(types.EDIT_SPORT_TYPE, payload) 
}, 

정도 등을

edit_sport_type({ state, commit, getters }, event) { 
    const payload = {sportName, getters.getSportName} <------- 
    commit(types.EDIT_SPORT_TYPE, payload) 
}, 

또는 악화 : 구성 소품에서 매개 변수를 가져 와서 발송할 때마다 발송합니다.

많은 동작에 대해이를 추상화 할 수있는 방법이 있습니까?

또는 아마도 돌연변이 자체 내에서 대안적인 접근 방법이 있을까요?

Answer 1

내 지식 (그리고 내가 연구하고있는 프로젝트에 대해 조사한 바 있습니다.) 아니요. 이 작업을 수행하는 가장 간단한 방법은 루트 페칭 또는 원하는 작업을 서비스에 추상화하여 vuex 파일에서 사용하거나 모듈 방식을 사용하는 경우 actions.js 파일에서 가져 오는 것입니다.

그래서 paramFetching.js 파일은 다음과 같습니다

export default { 
    fetchRouteParams: function() { 
    // do fetching 
    // you should return a promise 
    } 
} 

는 그런 다음 이렇게

... 
fetchParamsAction: function({commit}) { 
    service.fetchRouteParams() 
    .then((response) => { // stuff gottten from service. you should o your commit here }) 
    .catch((error) => { // error handling }) 
} 

과 같은 작업을 당신의 vuex

import service from 'paramFetching.js' 

을로 그를 가져온 다음 확인 이 작업을 보내면 모든 것이 하나의 작업으로 처리됩니다. 그래서 그것은 코드의 나머지 부분과는 분리되어 있습니다. 이것은 일반적인 아이디어 일뿐입니다. 충분히 명확하지 않으면 미안 해요. 더 도움이 될 수 있으면 물어보십시오. 당신의 질문을 이해하기

Answer 2

확실하지,하지만이 플러그인은 동기화 라우터 '상태와 상점을 유지
:
https://github.com/vuejs/vuex-router-sync

그것을 당신이 찾고있는 것을처럼 들린다.

Answer 3

vuex 저장소 작업에서 params를 가져 오려면 vue-router 인스턴스를 가져온 다음 vuex 저장소 작업에서 라우터 인스턴스의 params에 액세스하십시오. 아래

샘플 구현 :

라우터 src/router/index.js에서 :

import Vue from 'vue' 
import VueRouter from 'vue-router' 
import routes from './routes' 

Vue.use(VueRouter) 

const router = new VueRouter({ 
    mode: 'history', 
    routes 
}) 

export default router 

```

이 vuex 가게에서 라우터를 가져옵니다

import router from '@/router' 
------- 

는 vuex 조치에 PARAMS에 액세스 함수,이 경우에는 "id"입니다 (아래 참조) :

router.currentRoute.params.id