Redux - 如何在reducer中添加数组的条目 [英] Redux - How to add entry to array in reducer
问题描述
state = {
entryId:{
entryName:[something,something2,something3/ *等等... * /]
}
};
到目前为止,这是我最接近的,但是,而不是添加新的唯一条目,它正在替换已经存储的那个。此外,我需要能够将此项目添加到空状态,其中entryId,entryName不存在以避免错误:
switch(type){
case ADD_ENTRY:
return {
... state,
[entryId]:{
...状态[entryId],
[entryName]:{
[uniqueEntry]:true
}
}
};
}
任何想法我在做错什么?
如果你想添加一个元素到 entryName
数组的末尾,你应该是做:
return {
...状态
[entryId]:{
... state [entryId],
[entryName]:[
... state [entryId] [entryName],
uniqueEntry
]
}
};
ES6传播与数组的工作原理如下:
< pre class =lang-js prettyprint-override>
const array1 = [1,2,3];
const array2 = [4,5,6];
const 8 = 8;
const newArray = ['stuff',... array1,'things',... array2,... [7,8],9];
console.log(newArray); // [stuff,1,2,3,things,4,5,6,7,8,9]
查看这个要点,其中有一个非常类似于你正在做的事情的例子
我发现这组示例也非常有帮助。这里有很多好东西:
https:// github .com / sebarkbage / ecmascript-rest-spread
更新:
如果 entryName
被初始化为 undefined
像你在评论中说的那样,你可以这样做:
return {
... state,
[entryId]:{
... state [ entryId],
[entryName]:[
... state [entryId] [entryName] || [],
uniqueEntry
]
}
};
我认为这是一个非常好的例子,它使用React / redux大量的嵌套数据结构。 FWIW,多次推荐我尽可能地平坦化你的状态。
I stuck with this bit and I can't progress - I guess solution is simple but I can't figure out. I'm trying to add entry in reducer so data in in would look something this:
state = {
entryId: {
entryName: ["something", "something2", "something3" /* and so on... */]
}
};
So far this is the closest I get, but, instead of adding new unique entry, it is replacing the one that is stored already. Also I need to be able to add this item to empty state where entryId, entryName doesn't exist yet to avoid error:
switch(type) {
case ADD_ENTRY:
return {
...state,
[entryId]: {
...state[entryId],
[entryName]: {
[uniqueEntry]: true
}
}
};
}
Any idea what I'm doing wrong?
If you're trying to add an element to the end of the entryName
array you should be doing:
return {
...state,
[entryId]: {
...state[entryId],
[entryName]: [
...state[entryId][entryName],
uniqueEntry
]
}
};
ES6 spread with arrays works like this:
const array1 = [1, 2, 3];
const array2 = [4, 5, 6];
const eight = 8;
const newArray = ['stuff', ...array1, 'things', ...array2, ...[7, eight], 9];
console.log(newArray); // ["stuff", 1, 2, 3, "things", 4, 5, 6, 7, 8, 9]
Check out this gist which has an example of something very similar to what you're doing.
I found this set of examples extremely helpful as well. A lot of great stuff in here:
https://github.com/sebmarkbage/ecmascript-rest-spread
Update:
If entryName
is initialized to undefined
like you say in your comment, you could do this:
return {
...state,
[entryId]: {
...state[entryId],
[entryName]: [
...state[entryId][entryName] || [],
uniqueEntry
]
}
};
I think this is a pretty great example of how painful it can be working with React/redux using a heavily nested data structure. FWIW, it's been recommended to me many times to flatten your state as much as possible.
这篇关于Redux - 如何在reducer中添加数组的条目的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!