redux reselect is returning a function

Question

For some strange weird reason my reselect selector is returning this function :

ƒ () {
    if (!areArgumentsShallowlyEqual(equalityCheck, lastArgs, arguments)) {
        // apply arguments instead of spreading for performance.
        lastResult = func.apply(null, arguments);
    }

I do not understand why it is doing this. It is supposed to return some JSON which I can use to map in my mapToProps.

My redux mapping is simple enough and looks like this :

const mapStateToProps = (state) => {
    return {
        initialValues: selectShop(state),
    }
}

My selector file looks like this :

import { createSelector } from 'reselect';

//shops selector
const selectDomain = () => state => (state ? state.shops : {});

export const selectShop = () =>
    createSelector(
        selectDomain(),
        shops => {
            let shop = shops.filter(shop => shop.selected);
            return shop[0];
        },
    );

Why am I getting a function returned instead of JSON?

Nothing "strange" `createSelector` creates selector function. :) — Yury Tarabanko, Mar 13 '19 at 16:53
am I supposed to write my mapToDispatch code like this : initialValues: () => selectShop(state), — Oliver Watkins, Mar 13 '19 at 17:01
No. You need to reimplement `selectShop` to be the result of `createSelector` call. — Yury Tarabanko, Mar 13 '19 at 17:10
ok looks like I'm getting confused with my 'create' and 'select' functions again — Oliver Watkins, Mar 13 '19 at 17:48

score 2 · Accepted Answer · answered Mar 13 '19 at 17:09

2

You are using createSelector wrong. It actually returns a memoized version of a function.

Something like this should work

import { createSelector } from 'reselect';

//shops selector
const selectDomain = state => (state ? state.shops : []); // I've fixed it to return an array 

export const selectShop = createSelector(
  selectDomain,
  // you could use find instead of `filter` herr
  shops => shops.find(shop => shop.selected)
)

answered Mar 13 '19 at 17:09

Yury Tarabanko

44,270
9
84
98

For clarity, the OP was facing issues because he was **returning** a createSelector function, when he should have been setting his `selectShop` variable to the result of the createSelector. Returning the createSelector returns a memoized function, while returning the result of the createSelector gets the value. – vijayxtreme Jul 02 '21 at 02:04

score 1 · Answer 2 · answered Mar 13 '19 at 17:54

1

Also to add to the accepted answer. The selector is being called wrong. This is how it should be called correctly :

const mapStateToProps = (state) => {
    let selector = selectShop()

    return {
        initialValues: selector (state),
    }
}

answered Mar 13 '19 at 17:54

Oliver Watkins

12,575
33
119
225

redux reselect is returning a function

2 Answers2