代码之家  ›  专栏  ›  技术社区  ›  Bas

Vuejs从应用程序外部更改数据VUEX存储状态

  •  0
  • Bas  · 技术社区  · 7 年前

    我有一个例子 app.js 具有 store.js npm run dev 我得到了一个.js,我可以把它包含在一个页面中,包括 <div>

    现在我想改变的是 state.baseurl 从外部使用javascript,比如:

    var options = {
        baseurl:  'http://www.domain.co/'
    }
    

    应用程序js

    window.Vue = require('vue')
    import store from './store'
    import adrescheck from '../../../../../../../../resources/assets/js/vuecomponenten/components/check'
    Vue.component('check', check)
    import app from './app.vue'
    
    const app = new Vue({
        el: '#app',
        store,
        render: h => h(app)
    
    });
    

    商店.js

    window.Vue = require('vue');
    
    import Vuex from 'vuex'
    
    Vue.use(Vuex)
    
    const store = {
        state: {
            baseurl: 'http://www.domain.nl/'
        }
    }
    
    export default new Vuex.Store(
        store
    );
    

    编辑:

    当我执行npm run watch poll/dev/prod时,它将生成一个.js文件,并将其与webpack一起复制到一个公共文件夹中。从另一个域我想包括这个js 以及 希望从该域操作state.baseurl。所以依赖注入。

    1 回复  |  直到 7 年前
        1
  •  0
  •   rifi2k    7 年前

    如果我理解正确的话,我想最好的方法就是使用 webpack define plugin .

    传递到DefinePlugin的每个密钥都是一个标识符或多个 与..连接的标识符。。

    如果值是一个字符串,它将被用作代码片段。如果 值不是字符串,它将被字符串化(包括函数)。如果 前缀typeof到键,它只为调用类型定义。这个 删除多余的条件。

    new webpack.DefinePlugin({
      PRODUCTION: JSON.stringify(true),
      VERSION: JSON.stringify('5fa3b9'),
      BROWSER_SUPPORTS_HTML5: true,
      TWO: '1+1',
      'typeof window': JSON.stringify('object'),
      'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV)
    });
    

    然后在js中

    if (!PRODUCTION) {
      console.log('Debug info');
    }
    
    if (PRODUCTION) {
      console.log('Production log');
    }