在 reducer 中使用变量作为对象键 [英] Use a variable as an object key in reducer
问题描述
我在构建对象时遇到问题.我有一个字符串(在本例中称为SKU"),它通过 action
作为 action.name
传入.
I'm having trouble constructing an object. I've got a string (called "SKU" for this example) and it's coming through action
as action.name
.
我在 reducer 函数中拥有所有可用的东西,但我需要将硬编码的 SKU
更改为 action.name,但显然这在 JS 中是不可能的.我已经尝试了 action.name
、action['name']
和其他变体,但我被卡住了.
I have everything available in the reducer function but I need to change the hardcoded SKU
to action.name, but obviously that's not possible in JS. I've tried action.name
, action['name']
and other variations and I'm stuck.
解决方法是什么?任何帮助表示赞赏!谢谢.
What is the work around? Any help appreciated! Thanks.
这是一些代码,以便您可以看到发生了什么:
Here's some code so you can see what's going on:
日期改变时触发的函数...
handleChange(date) {
this.props.addDate(date, this.props.dashboardName);
}
mapDispatch 连接在组件导出底部...
const mapDispatchToProps = dispatch => {
return {
addDate: (date, name) => dispatch({
type: 'ACTION_DASHBOARD_ADD_DATE',
date,
name
})
};
};
动作创建者...
export function DashboardDate() {
return {
type: ACTION_DASHBOARD_ADD_DATE
};
}
reducer 开关的情况...
case ACTION_DASHBOARD_ADD_DATE: {
var filter = {};
filter[action.name] = action.date;
return {
...state,
dashboard: {
...state.dashboard,
// Below SKU needs to be the value of action.name
SKU: {
// Below too, action.name
...state.dashboard.SKU,
filter
}
}
};
}
推荐答案
我不是 100% 确定您想让 sku
出现在您的代码中的哪个位置,但是您可以创建一个对象像这样的计算属性名称:
I'm not 100% sure where in your code you want to have the sku
appear, but you can create an object with a computed property name like this:
const obj = {
[action.name]: action.payload
};
console.log(obj); // { "sku": "abcd" }
计算属性名称是 ES2015 (ES6) 功能.
Computed property names are an ES2015 (ES6) feature.
这篇关于在 reducer 中使用变量作为对象键的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!