sourcecode

VM이 정의되어 있지 않습니다(vueC가 있는 vueJ).리

copyscript 2022. 7. 23. 13:54
반응형

VM이 정의되어 있지 않습니다(vueC가 있는 vueJ).

프로젝트에 vue-cli를 사용하고 있습니다.vue-route 및 vuex도 프로젝트에 추가되었습니다.루트가 잘 작동한다.전송 중인 vuex 스토어 데이터를 확인하는 동안vm is not defined오류입니다. 코드 블록은 아래에서 찾을 수 있습니다.

main.discloss.main.discloss.

// Application
var vm = new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')

window.vm = vm;

router.displaces

import Vue from 'vue'
import Router from 'vue-router'
import auth from './controller/authController'
import Login from './views/Login.vue'

Vue.use(Router)

export default new Router({
  mode: 'history',
  routes: [
    { path: '/', component: Dashboard, beforeEnter: auth.checkAuth },
    { path: '/login', component: Login }
  ]
})

이 시점에서 문제가 발생하고 있습니다.vuex 저장소에 도달했기 때문에 인증 js에 VM이 정의되어 있습니다.

auth js

function checkAuth() {
  vm.$store.getters.getServerPath();
.... bla bla 
.... bla bla 
}

누군가 나에게 조언을 해주길 바란다.필요하다면 더 자세한 정보를 공유할 수 있습니다.

이 경우 vue 인스턴스가 아닌 vuex 스토어 자체를 Import 및 내보내는 것이 더 일반적인 접근 방식이라고 생각합니다.

그래서 네 안에auth.js스토어를 Import한 후 직접 getter에 액세스합니다.

import store from '@/app/store/main.store'; // or whatever path it is
function checkAuth() {
  store.getters.getServerPath();
.... bla bla 
.... bla bla 
}

인스턴스(또는 스토어)를 내보내는 것보다 이 방법이 더 낫다고 생각합니다.window그 이유를 묻고 있습니다.vm코드에 정의되어 있지 않습니다.그건 잘 모르겠지만

참조하려고 했습니까?vm에서 직접window잘은 모르겠지만 vue-cli 코드나 babel은 아마 그 코드를strict mode따라서 명시적으로 참조할 필요가 있습니다.window로부터의 속성window:

function checkAuth() {
  window.vm.$store.getters.getServerPath();
.... bla bla 
.... bla bla 
}

사용 가능한 창 개체에 의존하지 않고 vue 인스턴스를 내보내고 가져올 수 있습니다.

main.discloss.main.discloss.

// Application
var vm = new Vue({
  router,
  store,
  render: h => h(App)
})
vm.$mount('#app')

export const vueInstance = vm

auth.displays(인증)

import { vueInstance } from '@/main'
function checkAuth() {
  vueInstance.$store.getters.getServerPath();
.... bla bla 
.... bla bla 
}

마운트부터 VueCLI3을 사용하고 있는 것 같습니다.이 기능을 사용해 보십시오.window..

main.js

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");

router.js

import auth from './auth'
...
{ path: '/', component: Dashboard, beforeEnter: auth.checkAuth }

auth.js

import store from './store'
...
function checkAuth() {
  store.getters.getServerPath();
}
export default checkAuth

언급URL : https://stackoverflow.com/questions/53849739/vm-is-not-defined-vuejs-with-vuecli

반응형