在反應應用程序中使用全局配置對象

Question

我有由生成器定義的config.js文件;

'use strict'; 

import baseConfig from './base'; 

let config = { 
    appEnv: 'dev', // feel free to remove the appEnv property here, 
    baseUrl:'https://mod970274.sharepoint.com',//'http://maliye.milliemlak.gov.tr', 
    listName:'' 
}; 

export default Object.freeze(Object.assign({}, baseConfig, config)); 

這裏我怎麼稱呼它。

import config from 'config'; 

class FooterState { 
    @observable items =[]; 
    constructor(){ 
     config.listName = 'FooterMenu'; 
     this.getItems(); 
    } 
    getItems() { 
    fetch(`${config.baseUrl}/_api/web/lists/getbytitle('${config.listName}')/items`, { 
     method: 'GET', 
     headers: { 
      'Accept': 'application/json', 
      'Content-Type': 'application/json', 

但事實上，使用示例看起來相同，它會在構造函數中引發未定義的異常。這是它的外觀：

我怎麼能在項目

Answer 1

export default Object.freeze(Object.assign({}, baseConfig, config)); 

此行freezes的對象，這意味着你不能重新分配它的任何性質的使用配置對象無處不在：

Object.freeze（）方法凍結一個對象：也就是說，阻止將新屬性添加到它;防止現有屬性被刪除;並防止改變現有屬性或其可枚舉性，可配置性或可寫性。該方法返回被凍結的對象。

如果你想改變這個對象的數據，你應該刪除Object.freeze：

export default Object.assign({}, baseConfig, config) // Or just: export default {...baseConfig, ...config} 

Answer 2

你的配置對象是凍結的：

export default Object.freeze(Object.assign({}, baseConfig, config)); 

因此，你不能修改它。現在你有兩個選擇：

1. 刪除config.js
2. 調用Object.freeze，如果你不能修改config.js，與Object.assign()定義自己的可變派生的配置對象：

_

/* mutable-config.js */ 
import config from 'config' 
module.exports = Object.assign({}, config) 

現在您可以在代碼中使用mutable-config而不是config：

import config from 'mutable-config' /* instead of from `config` */ 

class FooterState { 
    @observable items =[]; 
[...]