Immutable.js mergeDeepWith问题

Question

我很有趣的是Immutable.js并且在将对象与数组合并时遇到了问题.

我对合并的要求是:

function singleTrackReducer(state = Immutable.Map(singleTrack), action) {
  switch (action.type){
    case AudioFormActions.CHANGE:
        return state.mergeDeepWith((prev, next) => next, action.entity);
    default:
      return state;
    }
}

我合并的对象看起来像这样:

const singleTrack = {
  songTitle: '',
  mainArtists: [],
  featuredArtists: [],
  releaseDate: '',
  primaryGenre: '',
  isExplicit: false,
  labelName:'',
  upCode: '',
  eanCode: '',
  isrcCode:'',
  copyRight: ''
};

我正在尝试更新mainArtists属性..例如,我可以添加几个艺术家到我的艺术家数组并成功执行更新.但是,当我从数组中删除一个对象时,它似乎填充了一个前一个对象.

比如说艺术家阵列是[drake,rihanna,tyga]

如果我用动作实体[drake,rihanna,tyga,john]调用该函数,它会更新并且mainArtists属性变为[drake,rihanna,tyga,john].

当我删除一个艺术家的例子tyga和数组是[drake,rihanna,john]

主要艺术家成为[德雷克,里哈纳,约翰,约翰]

任何人都可以解释我如何解决这个问题

Answer 1

我认为此代码可以帮助您理解问题:

var Immutable = require('immutable');

console.log(
  Immutable.List(['a', 'b', 'c'])
    .mergeDeep(['a', 'c'])
);
// output: List [ "a", "c", "c" ]

console.log(Immutable.List(['a', 'b', 'c'])
  .mergeDeepWith((prev, next) => {
    console.log(`Conflict between ${prev} and ${next}.`);
    return next;
  }, ['a', 'c'])
);
// output: Conflict between a and a.
//         Conflict between b and c.
//         List [ "a", "c", "c" ]

基本上,在合并列表时,项目似乎在每个索引处从一个项目复制到另一个项目,如果该索引处已有值,则认为是冲突:

• 对于索引#0,第一个列表中有"a",第二个列表中有"a".我们通过优先选择第二个值来解决冲突(尽管在这种情况下它们是相同的).所以索引#0得到"a".
• 然后我们转到索引#1并找到第一个列表有"b"而第二个列表有"c".我们通过选择第二个值来解决冲突,因此索引#1变为"c".
• 现在对于索引#2,我们没有冲突,因为只有第一个列表有值.我们在索引#2中保留"c",因此最终列表是"a","c","c".

你可以使用一个集合,但它基本上执行一个联合操作,所以什么都不会被删除:

console.log(
    Immutable.Set(['a', 'b', 'c'])
        .mergeDeep(['a', 'c'])
);
// output: Set { "a", "b", "c" }

我实际上并不认为你想要合并这个列表......我想你只想将新值复制到旧值上.如果是这种情况,也许你只是在寻找merge而不是mergeDeep:

var state = Immutable.Map({
  songTitle: '',
  mainArtists: [],
  featuredArtists: [],
  releaseDate: '',
  primaryGenre: '',
  isExplicit: false,
  labelName:'',
  upCode: '',
  eanCode: '',
  isrcCode:'',
  copyRight: ''
});

function doMerge(state, newState) {
  // no deep merge here, just copy whatever fields are present in newState
  return state.merge(newState);
}

console.log(state.get('mainArtists'));
// output: []

state = doMerge(state, {
  mainArtists: ['drake', 'rihanna', 'tyga']
});
console.log(state.get('mainArtists'));
// output: List [ "drake", "rihanna", "tyga" ]

state = doMerge(state, {
  mainArtists: ['drake', 'rihanna', 'tyga', 'john']
});
console.log(state.get('mainArtists'));
// output: List [ "drake", "rihanna", "tyga", "john" ]

state = doMerge(state, {
    mainArtists: ['drake', 'rihanna', 'john']
});
console.log(state.get('mainArtists'));
// output: List [ "drake", "rihanna", "john" ]