使用变量作为对象的值

Question

我有一个函数可以接受几个参数，其中一个参数可以是一个具有其他属性的对象。像这样：

myFunction(res.columns, res.data, { 
     margin: { 
      top: 65 
     }, 
     styles: { 
      overflow: 'linebreak', 
     }, 
     columnStyles: { 
      1: { 
       columnWidth: 100 
      }, 
      2: { 
       columnWidth: 80 
      } 
     } 
}): 

现在，我的问题是这样的： 你可以看到，在那里有不同的指标，它里面“columnStyles”有其值的属性。问题在于，根据请求的类型，数字100和80会改变。我想要做的是，根据你所得到的参数，我的值赋给一个变量像这样的情况下切换：

switch (type) { 
     case 'components': 
      config = { 
       1: { 
        columnWidth: 100 
       }, 
       2: { 
        columnWidth: 80 
       } 
      } 
      console.log(config); 
      break; 
    } 

我想要做的只是，在“columnStyles”把“配置”，并为它取上面的开关的情况下被分配的值，因此这将是这样的：

myFunction(res.columns, res.data, { 
      margin: { 
       top: 65 
      }, 
      styles: { 
       overflow: 'linebreak', 
      }, 
      columnStyles: { 
       config 
      } 
    }): 

我所看到的是，在调试器控制台，“配置”他的价值观是正确的，但他们没有被接受，也没有做任何事情。

任何想法或建议？

谢谢！

Answer 1

为什么不只是将columnStyles设置为config？

myFunction(res.columns, res.data, { 
     margin: { 
      top: 65 
     }, 
     styles: { 
      overflow: 'linebreak', 
     }, 
     columnStyles: config 
}): 

除非，我错过了什么，上面应该适合你。

如果你想合并在config与其他值，那么你可以使用像Object.assign或对象传播（...）。

要合并你可能想这样做：

myFunction(res.columns, res.data, { 
     margin: { 
      top: 65 
     }, 
     styles: { 
      overflow: 'linebreak', 
     }, 
     columnStyles: Object.assign(existingConfig, config) 
}): 

或

myFunction(res.columns, res.data, { 
     margin: { 
      top: 65 
     }, 
     styles: { 
      overflow: 'linebreak', 
     }, 
     columnStyles: { 
      3: { 
       columnWidth: 123 
      }, 
      4: { 
       columnWidth: 678 
      }, 
      ...config 
     } 
}); 

*注：该对象传播语法可能无法在节点的一些版本没有一些transpiling帮助:)

Answer 2

只要写

myFunction(res.columns, res.data, { 
      margin: { 
       top: 65 
      }, 
      styles: { 
       overflow: 'linebreak', 
      }, 
      columnStyles: config, 
}): 

你应该很好。添加额外的大括号不会添加对象名称作为属性：

{ 
       margin: { 
        top: 65 
       }, 
       styles: { 
        overflow: 'linebreak', 
       }, 
       columnStyles: { 
        config: { 
         columnStyles: {...} 
        } 
       } 
}