重新選擇選擇器結構

Question

我有以下示例結構..

userId: { 
    savedEvents: { 
    eventId: true, 
    eventId: true, 
    eventId: true, 
    }, 
    organisedEvents: { 
    eventId: true, 
    eventId: true, 
    eventId: true, 
    }, 
    attendingEvents: { 
    eventId: true, 
    eventId: true, 
    eventId: true, 
    } 
} 

我使用重選createSelector方法嘗試和對存儲器的優化和重新使用的業務邏輯的鏈選擇器..

對於例如： -

userOrganisedEventsSelector 

返回有組織的事件ID列表。

activeUserOrganisedEventsSelector 

用途userOrganisedEventsSelector的輸出與已應用

sortedActiveUserOrganisedEventsSelector 

排序activeUserOrganisedEventsSelector

的輸出

上述三種方法接受包含用戶id道具對象，一組過濾器從它然後可以確定組織的事件。

問題： -

1. 我想對所有三種事件類型（savedEvents，organisedEvents和attendingEvents）

2. 在某些情況下我想的用戶id相同的功能，以提供通過道具，其他時間我需要從狀態使用userId。

我在尋找幫助或建議如何實現這一點，而不創建30奇怪的功能，同時保留通過重新選擇記憶的好處。

Answer 1

我建議你給re-reselect一試。當我發現自己在類似於你的場景中寫了幾乎相同的選擇器時，我寫了一個很小的包裝器reselect。

它可以讓你不重複選擇的代碼，並能夠更好地管理通過選擇不同的PARAMS緩存時（例如，您的userID）。

這裏的僞代碼行數，只要你得到你在正確的軌道上：

import createSelector from 'reselect'; 
import createCachedSelector from 're-reselect'; 

// Normal reselect selector: 
// getUserEvents(state, userId) 
const getUserEvents = createSelector(
    state => state.events 
    (state, userId) => userId,   // Get user from state if userId not provided 
    (events, userId) => events[userId], // Return user's events 
); 

// Cached re-reselect selector (cached by eventType): 
// getUserEventsOfType(state, userId, eventType = 'ALL') 
const getUserEventsOfType = createCachedSelector(
    getUserEvents,      // Get events from getUserEvents 
    (state, userId, eventType = 'ALL') => eventType, 
    (userEvents, eventType) => userEvents[eventType] // Just pseudo code! 
)(
    // Keep memoization when calling selector with different eventType 
    (state, userId, eventType = 'ALL') => eventType, 
);