与后端Config类似，EggBornJS也实现了前端模块级别的参数配置特性

  1. 模块可以单独实现自己的参数配置
  2. 项目级别的参数配置可以覆盖模块级别的参数配置

定义参数

src/suite-vendor/test-party/modules/test-party/front/src/config/config.js

  1. 1export default {
  2. 2  message: 'Hello World',
  3. 3  markCount: 2,
  4. 4};

使用参数

模块内部使用

src/suite-vendor/test-party/modules/test-party/front/src/kitchen-sink/pages/guide.vue

  1. 1onPerformClick4() {
  2. 2  const params = {
  3. 3    message: this.$config.message,
  4. 4    markCount: this.$config.markCount,
  5. 5  };
  6. 6  return this.$api.post('kitchen-sink/guide/echo4', params).then(data => {
  7. 7    this.message4 = data;
  8. 8  });
  9. 9},

跨模块使用

如果是跨模块使用另一个模块的参数配置，方式如下：

  1. 1this.$meta.module.use('test-party', module => {
  2. 2  const message = this.$meta.config.modules['test-party'].message;
  3. 3});
名称 说明
$meta.module.use 模块前端一般是异步加载的，因此在使用模块的信息之前，需要确保此模块已经加载
$meta.config.modules[moduleName] 返回指定模块的config对象

覆盖参数

可以使用项目级别的参数覆盖模块级别的参数，从而方便我们从项目层面定制模块的行为参数

src/front/config/config.{scene}.js

  1. 1export default{
  2. 2  modules: {
  3. 3    'test-party': {
  4. 4      message: 'Hello World!',
  5. 5      markCount: 3,
  6. 6    },
  7. 7  },
  8. 8};