Vue:如何应用多个全局Mixins

时间:2019-05-23 07:21:38

标签: vue.js vuex

我目前正在从事一个Vue项目,其中包括多个应用程序。 它具有项目范围内使用的方法和应用程序范围内使用的方法。 因此,我创建了2个mixin,它们需要在每个Vue组件中都可用。但是,我不知道如何使用Vue.mixin()实现它。 请帮忙。

我尝试过了。不行。

错误显示"Cannot read property 'VALIDATION' of undefined"。 无法以某种方式导入URL。 URL()返回一个对象,该对象根据DEV或PRODUCTION模式定义了url。

import global_mixin from './global_mixin.js'
import application_mixin from './application_mixin.js'

Vue.mixin(global_mixin)
Vue.mixin(application_mixin)

new Vue({
  el: '#app',
  render: h => h(App)
})

global_mixin.js

export default {
  data() {
    return {
      // data items
    }
  }
}

application_mixin.js

import { URL } from './_util'

export default {
  data() {
    return {
      URL_VALIDATION: URL().VALIDATION
    }
  }
}

_util.js

import store from './_store'

export const URL = () => {
  const urls = {
    PROD: {
      VALIDATION: '/api/web/company/profile/validation',
      PROFILE: '/api/web/company/profile',
      COUNTRY: '/api/app/countries',
      ADDRESS: '/api/web/address'
    },
    DEV: {
      PROFILE: '/data/profile_company.json',
      VALIDATION: 'https://httpbin.org/post',
      COUNTRY: '/data/countries.json',
      ADDRESS: '/data/zip.json'
    }
  }

  return urls[store.getters.mode]
}

0 个答案:

没有答案