ImmutableJs - 如何根据地图中的位置检索关键词

时间:2017-03-25 13:22:16

标签: javascript loops key immutable.js

我正在使用immutableJs

我的状态对象如下所示:

export const initialToolbarState = Map({
    temSelectionCtrl : Map({
        temSelect : true,
    }),
    functionalCtrl : Map({
        addEle : true,
        grpSelect : true,
        drawShape : true
    }),
    operationalCtrl : Map({
        zoomIn : true,
         zoomOut : true,
         pan : true,
         temSide : true
    }),
    referenceCtrl : Map({
        saveCtrl : true
    })
});

因此,存在具有boolean值的键的对象。

我想映射(循环)这些对象&得到他们的keysboolean值表示是否呈现key。 Immutable允许我们使用其自定义Map函数映射map。因此,以下工作,但不是预期的:

// map over the initialToolbarState Map object 
let ctrls = initialToolbarState.map(( eachToolbar ) => {
  // map over the child Map objects like temSelectionCtrl, functionalCtrl, operationalCtrl etc
  return eachToolbar.map(( eachCtrl, i ) => {
    // get the key corresponding to 'eachCtrl' value
    let propKey = eachToolbar.keyOf( eachCtrl );
      // propKey is always the first property (1st prop) of 'eachToolbar'
        console.log( propKey );
...

使用immutableJs,是否有办法获得与当前' eachCtrl'相对应的正确key。循环中的值?我可以确保i帮助将其指向与value匹配的正确key吗?

1 个答案:

答案 0 :(得分:1)

您可以在对象上再次使用.map。第二个参数是密钥,完整参数签名为(mapper (value: V, key: K, iter: this))

所以,这个片段:

initialToolbarState.map(( eachToolbar ) => {
  eachToolbar.map((value, key) => {
    console.log(key, ' ==> ', value);
  });
});

将记录:

temSelect  ==>  true
addEle  ==>  true
grpSelect  ==>  true
drawShape  ==>  true
// etc…

现在只需将您的返回链接起来即可创建您需要的数据结构或使用您的密钥执行任何操作。

此外,如果“地图地图”是您正在解决的问题的最佳结构,请重新考虑。如果您需要经常迭代,也许“地图列表”会更好。您不会对单个项目进行即时读取/更新,但如果您的列表仅包含几个项目,则性能不会受到影响。