如何在Reduce Reducer中使用reselct選擇器

Question

我的應用程序已經有各種容器對象使用的大量選擇器。這些對於訪問狀態的不同部分非常有用，並且使得重構狀態變得更容易。

現在我想在我的一些reducer函數中使用我的選擇器。問題是在reducer內部，state參數引用狀態的特定片段，而選擇器函數期望與狀態根對象一起調用。

人爲的例子：

/* Selectors */ 
const getTodos = state => state.todos; 

const getUncompletedTodos = createSelector(
    [ getTodos ], 
    todos => todos.filter(t => !t.completed) 
); 

/* Reducer */ 
const todosReducer = (state, action) => { 
    switch (action.type) { 
    case 'ADD_TODO': 
     return [ 
     ...state, 
     { 
      id: action.id, 
      text: action.text, 
      completed: false 
     } 
     ]; 
    case 'REMOVE_COMPLETED_TODOS': 
     return getUncompletedTodos(state); // <-- this won't work 
    } 
} 

Answer 1

您選擇作品從根狀態對象。

僞造這一點，你可以做

return getUncompletedTodos({todos: state}); 

但恕我直言一個更好的想法是重新使用過濾功能

/* Selectors */ 
const getTodos = state => state.todos; 

const filterCompleted = todos => todos.filter(t => !t.completed) 

const getUncompletedTodos = createSelector(
    [ getTodos ], 
    filterCompleted 
); 

// inside reducer 
case 'REMOVE_COMPLETED_TODOS': 
    return filterCompleted(state);