programing

vuex 저장소의 app.config.globalProperties 액세스

prostudy 2022. 4. 15. 22:14
반응형

vuex 저장소의 app.config.globalProperties 액세스

이런 푸렉스 가게가 생겼어

const state = {
    status: '',
};

const getters = {
   //...
};

const actions = {

 // ...
};

const mutations = {
// ... 
};

export default {
    namespaced: true,
    state,
    getters,
    actions,
    mutations,
}

이제 액세스하고 싶다.app.config.globalProperties.$notify

Vue.js2에서 나는 다음과 같은 것을 사용하고 있었다.Vue.prototype.$notify하지만 이건 더 이상 작동하지 않아.

$notify또한 다음과 같이 제공된다.

app.use(routes)
  .provide('notify', app.config.globalProperties.$notify)
  .mount('#app')

불행히도 나는 이것에 대한 어떤 정보도 아직 문서에서 발견하지 못했다.

그래서 내 질문은:어떻게 하면 주사할 수 있을까?$notify또는 접근app.config.globalProperties이 가게 안에?

상점과 그 모듈에서 당신은 상점 공장을 반환할 수 있다. 즉, 응용 프로그램 인스턴스를 수신하는 기능이다.createApp상점 반환:

// store/modules/my-module.js
const createStore = app => {
  const mutations = {
    test (state, { committedItem }) {
      app.config.globalProperties.$notify('commited item: ' + committedItem)
    }
  }

  return {
    namespaced: true,
    //...
    mutations,
  }
}

export default app => createStore(app)
// store/index.js
import { createStore } from 'vuex'
import myModule from './modules/my-module'

export default app =>
  createStore({
    modules: {
      myModule: myModule(app)
    }
  })

그럼 매장 공장을 이렇게 쓰세요.

// main.js
import { createApp } from 'vue'
import App from './App.vue'
import createStore from './store'

const app = createApp(App)
app.use(createStore(app)).mount('#app')

데모를 하다

참조URL: https://stackoverflow.com/questions/68399458/access-app-config-globalproperties-in-vuex-store

반응형