CODEWITHSUNDEEP
javascriptreactjsreduxreact-redux
Petr Peller
Petr Peller

Reputation: 8826

Access props from selector's resultFunc

I have a similar use case as in the accessing react props in selectors docs, but in my case let's say the visibilityFilter comes from the props. Is there a way how to achieve something like below?

export const getVisibleTodos = createSelector(
  getTodos,
  (todos, props) => {
    // props is undefined 🙁
    switch (props.visibilityFilter) {
      case 'SHOW_ALL':
        return todos
      case 'SHOW_COMPLETED':
        return todos.filter(t => t.completed)
      case 'SHOW_ACTIVE':
        return todos.filter(t => !t.completed)
    }
  }
)

I still need it to be properly memoized, but I guess that's the second step.

Upvotes: 2

Views: 928

Answers (1)

James Newell
James Newell

Reputation: 653

Props (or ownProps) is the second argument passed to any mapStateToProps function.

Using that, you can extract the property you want as one of the inputs to your resultFunc.

export const getVisibleTodos = createSelector(
  getTodos,
  (state, props) => props.visibilityFilter,
  (todos, visibilityFilter) => {
    switch (visibilityFilter) {
      case 'SHOW_ALL':
        return todos
      case 'SHOW_COMPLETED':
        return todos.filter(t => t.completed)
      case 'SHOW_ACTIVE':
        return todos.filter(t => !t.completed)
    }
  }
)

Upvotes: 1

Related Questions