Den Dribbles

Reselect Quick And Dirty

May 25, 2019

Quick and dirty implementation of reselect. This assumes you already have the requirements for Redux installed and in operation.

Links

This link below is a great reference for indepth if you need more than a friendly reminder.

Dan Parker - Medium article

Installing Reselect

yarn install reselect

Basic Implementation

// Reducer file
import { createSelector } from "reselect"

/* Creating the Selector in reducer file */
const getElementsUi = state => state.sidebarReducer.elementsUi

export const getElementsUiState = createSelector(
  [getElementsUi],
  elementsUi => elementsUi
)

// In file calling mapStateToProps
const mapStateToProps = state => ({
  elementsUi: reducers.getElementsUiState(state),
})

const mapDispatchToProps = dispatch => ({ dispatch: dispatch })

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(Component)

A personal blog on all things of interest. Written by Dennis O'Keeffe, Follow me on Twitter