Immutable.js

Question

我正在使用 Immutable.js 尝试将对象添加到嵌套在对象中的列表中。我已经能够让我的第一个函数 handleRecieveLeads() 工作以设置传入的线索。我的第二个函数 handleSaveLeads() 无法正常工作。

到目前为止，通过注销我可以看到，被推入该不可变列表的新项目正在被覆盖。因此，当我将其记录到控制台时，您只会看到最后一个被推送的项目，而之前的那个项目已经消失了。这是 JS Bin 的 link：https://jsbin.com/fugajofaxi/edit?js,console

//Initial state
var state = Immutable.Map();

//sample lead
var leads = [{document_id: "L4234234234234",
              company_name: "someComp",
              date_filed:"083815",
              address:"11111 sw 123 ave",
              first_name: "john",
              last_name: "doe"
             },
             {document_id: "L11111111",
              company_name: "CorpComp",
              date_filed:"091919", 
              address:"22222 sw 456 Ave",
              first_name: "jane",
              last_name: "doe"
             }];

//Adds the new leads to the state
function handleRecieveLeads (state, leads) {
    var newState = state.set('leads', Immutable.List(leads));
    return console.log(newState.toJS());
}

handleRecieveLeads(state, leads);

//sample lead to save
var saveLeads = [{document_id: "L1919191919",
                  company_name: "someComp2",
                  date_filed:"083815",
                  address:"33333 SW 333rd Ave",
                  first_name: "dallas",
                  last_name: "thomas"
                 }];

//add leads to the savedLeads
function handleSaveLead (state, lead) {
    if(!state.savedLeads) {
        var newState = state.set('savedLeads', Immutable.List(lead));
        return console.log(newState.toJS());
    } else {
        var newState2 = state.get('savedLeads').push(lead);
        return console.log(newState2.toJS());
    }
}
//sample lead to save 2
var saveLeads2 = [{document_id: "L16161616",
                   company_name: "someComp3",
                   date_filed:"083815",
                   address:"444444 sw 555 Ave",
                   first_name: "crystal",
                   last_name: "mentos"
                  }];

handleSaveLead(state, saveLeads);

//setting a new initial state
var state2 = Immutable.fromJS({leads:leads, savedLeads: saveLeads});

handleSaveLead(state2, saveLeads2);

Answer 1

这里发生了几件事。首先，您永远不会 return 来自处理程序的新 'modified' 状态。

其次，state.savedLeads 始终未定义。使用 state.get('savedLeads') 代替

第三，当你使用 state.get('savedLeads') 并推送你想要设置的新项目时，return 新的状态。

在这里，试试这个：

//Initial state
var state = Immutable.Map();

//sample lead
var leads = [{document_id: "L4234234234234",
              company_name: "someComp",
              date_filed:"083815",
              address:"11111 sw 123 ave",
              first_name: "john",
              last_name: "doe"
             },
             {document_id: "L11111111",
              company_name: "CorpComp",
              date_filed:"091919", 
              address:"22222 sw 456 Ave",
              first_name: "jane",
              last_name: "doe"
             }];

//Adds the new leads to the state
function handleRecieveLeads (state, leads) {
    return state.set('leads', Immutable.List(leads));
}

var newState = handleRecieveLeads(state, leads);
console.log(newState.toJS())

//sample lead to save
var saveLeads = [{document_id: "L1919191919",
                  company_name: "someComp2",
                  date_filed:"083815",
                  address:"33333 SW 333rd Ave",
                  first_name: "dallas",
                  last_name: "thomas"
                 }];

//add leads to the savedLeads
function handleSaveLead (state, lead) {
    if(!state.get('savedLeads')) {
       return state.set('savedLeads', Immutable.List(lead));
    } else {
       var savedLeads = state.get('savedLeads');
       return state.set('savedLeads', savedLeads.push(lead));
    }
}
//sample lead to save 2
var saveLeads2 = [{document_id: "L16161616",
                   company_name: "someComp3",
                   date_filed:"083815",
                   address:"444444 sw 555 Ave",
                   first_name: "crystal",
                   last_name: "mentos"
                  }];

var newState2 = handleSaveLead(newState, saveLeads);
console.log(newState2.toJS())

var newState3 = handleSaveLead(newState2, saveLeads2);
console.log(newState3.toJS())

Immutable.js - Adding/updating 一个值到嵌套在地图中的列表

Immutable.js - Adding/updating a value into a list nested in a map

javascript

nested

immutablelist