CODEWITHSUNDEEP
javascriptreactjsrecompose
olafsadventures
olafsadventures

Reputation: 151

higher order function execution

I am confused about higher order functions in recompose. I am playing around with an example in codePen and am not sure why altering the function does not work.

I have tried playing in the console but nothing works.

const IncreaseHappiness2 = withStateHandlers(
  () => ({happiness: 0}), {
    onClick: ({happiness}) => () => ({happiness: happiness + 1}), 
  }
);

when I change to 

const IncreaseHappiness2 = withStateHandlers(
  () => ({happiness: 0}), {
    onClick: ({happiness})  => ({happiness: happiness + 1}), 
  }
);

nothings happens when I click on the button.

When I change to:

const IncreaseHappiness2 = withStateHandlers(
  () => ({happiness: 0}), {
    onClick: ({happiness}) => () => ({happiness: happiness + 1}), 
  }
);

I get "I am NaN% happy button!

I am using this for practice: https://codepen.io/Kiwka/pen/vWZVvL?editors=0111

Upvotes: 0

Views: 76

Answers (1)

Jayendra Sharan
Jayendra Sharan

Reputation: 1018

I don't think you can change the standard "arguments to be passed" to the withStateHandlers. It expects you to pass an initial state or a function to get the initial state. With that, the second argument is a function to update the state.

Please read the documentation: https://github.com/acdlite/recompose/blob/master/docs/API.md#withstatehandlers

Also, if you really want to understand how higher order function/components work, I think you should try to create your own HOF/HOC. I am sure there are tons of articles available on the internet.

Hope this helps.

Upvotes: 2

Related Questions