sourcecode

Quasar 부트 파일에서 스토어 액세스

copyscript 2022. 9. 25. 00:17
반응형

Quasar 부트 파일에서 스토어 액세스

Quasar를 사용하고 있으며 부트 파일(기본적으로 main.js와 동일)에 있습니다.

Vue.use(VueCurrencyFilter, {
  symbol: '$',
  thousandsSeparator: '.',
  fractionCount: 2,
  fractionSeparator: ',',
  symbolPosition: 'front',
  symbolSpacing: true
})

내 컴포넌트로 수행할 수 있는 작업:

{{purchaseOrderTotal | currency(currentLocation.currency)}}

currentLocationmapState로 호출된 스토어의 상태입니다.

currentLocation.currency의 통화입니다.symbol선택.

이것은 동작하지만 모든 컴포넌트에서 파라미터를 전달해야 합니다.

전화할 방법이 있나요?currentLocation.currencyjs 파일에서 기본값으로 사용할 수 있습니까?

Quasar의 부트 파일 구조를 잊어버렸습니다.

import VueCurrencyFilter from 'vue-currency-filter'

export default ({ Vue, store }) => {

    Vue.use(VueCurrencyFilter,
      .......
};

스토어를 Import하지 않고 내보내야 했습니다.

Vuex 스토어는 임의의 모듈로 Import할 수 있습니다.

import store from '@/store';

컴포넌트에서 사용하는 것과 마찬가지로 이 파일에서도 사용합니다.

let currency = store.state.currentLocation.currency;

이거랑 똑같아this.$store컴포넌트를 통해 접근할 수 있는 객체입니다.

Quasar 2에서는 새로운 부팅 파일 Quasar new boot file을 생성하는 방법이 있습니다.

작성된 파일 ../boot/file.(js|ts)에서는 변수 mystore(또는 함수에서 스토어와 라우터를 사용하는 경우에는 myrouter)를 정의합니다.

「export default(내보내기 디폴트)」로부터 초기화합니다.

import { boot } from 'quasar/wrappers'

let myrouter = null;
let mystore = null;


/**
 * @param {Array} value 
 */
const redirectFromLogin = (value) => {
  
  if (value.length > 1) {
    //set routing
    myrouter.push("/multiple");
  } else {
    //set routing
    myrouter.push("/single");
  }
}


/**
 * @param {Array} userdata 
 */
const saveUser = (userdata) => {
  // Save user info in Store
  mystore.commit("userstore/setUser", userdata);

}


// "async" is optional;
// more info on params: https://v2.quasar.dev/quasar-cli/boot-files

export default boot(async ({ app, router, store }) => {
  myrouter = router;
  mystore = store

})
export { saveUser, redirectFromLogin }

언급URL : https://stackoverflow.com/questions/60675934/accessing-store-from-quasar-boot-file

반응형