Как удалить элемент в списке с неизменяемым?

Question

Я использую реакцию + редукция с неизменяемым, и как я могу удалить какой-либо элемент в списке с неизменяемым?

import Immutable, { List, Map, fromJS } from 'immutable'; 

let initialState = fromJS({ 
    floor: [ 
     { 
      floor: '1', 
      rooms: [ 
       { 
        room: '101' 
       }, 
       { 
        room: '102' 
       }, 
       { 
        room: '103' 
       } 
      ] 
     } 
    ] 
}); 

export default function list(state = initialState, action) { 
    switch (action.type) { 
     //remove some room 
     case REMOVE_ROOM: 
      //how can I remove some element in List with Immutable? 
     default: 
      return state; 
    } 
}; 

тогда я направить действие, удалить некоторую комнату с dispatch(removeRoom('102')), но как я могу просто удалить {room: 102} с Неизменным?

Answer 1

Прежде всего, напишите функцию findRoomPath, чтобы найти путь по объектам вашего местонахождения.

И используйте deleteIn, чтобы удалить значение по этому пути.

var roomPath = findRoomPath(state, 101); 
state = state.deleteIn(roomPath); 

var state = Immutable.fromJS({ 
 
    floor: [ 
 
     { 
 
      floor: '1', 
 
      rooms: [ 
 
       { 
 
        room: '101' 
 
       } 
 
      ] 
 
     }, 
 
     { 
 
      floor: '2', 
 
      rooms: [ 
 
       { 
 
        room: '104' 
 
       } 
 
      ] 
 
     } 
 
    ] 
 
}); 
 

 
function findRoomPath(state, room) { 
 
    var keyPath = ['floor']; 
 
    state 
 
    .get('floor') 
 
    .find((v, k1) => { 
 
     return v 
 
     .get('rooms') 
 
     .find(function(v, k2) { 
 
      if (+v.get('room') === +room) { 
 
      keyPath.push(k1, 'rooms', k2); 
 
      return true; 
 
      } 
 
     }); 
 
    
 
    }); 
 

 
    return keyPath.length > 1 ? 
 
    keyPath : 
 
    null; 
 
} 
 

 
function deleteRoom(state, room) { 
 
    var roomPath = findRoomPath(state, room); 
 
    return (roomPath) ? 
 
    state.deleteIn(roomPath) : 
 
    state; 
 
} 
 

 

 
console.log(deleteRoom(state, 101).toJS());

<script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/3.8.1/immutable.min.js"></script>

Answer 2

Я должен сказать, что я не слишком опытен с Неизменным, но это несколько чистыми. Я бы настоятельно советовал вам пересмотреть структуру вашего государства! Вы сбережете себя от большой боли по дороге!

export default function list(state = initialState, {type, payload}) { 
    switch (type) { 
     //remove some room 
     case REMOVE_ROOM: 
      return removeRoom(state, payload); 
     default: 
      return state; 
    } 
}; 

const removeRoom (state, roomToRemove) => { 
    const floor = state.get('floor').map(floor => { 
    const rooms = floor.get('rooms').filter(room => room.get('room') !== roomToRemove) 
    return floor.merge({rooms}); 
    }) 
    return state.merge({floor}); 
};