Skip to content

Instantly share code, notes, and snippets.

@trueadm
Last active May 23, 2018 10:42
Show Gist options
  • Save trueadm/079048c1e002ea0e718fcf15294197db to your computer and use it in GitHub Desktop.
Save trueadm/079048c1e002ea0e718fcf15294197db to your computer and use it in GitHub Desktop.
const State = React.createState();
function MyComponent(props) {
return (
<State
initialState={() => ({ counter: 0, lastProps: props, divRef: React.createRef() }) }
deriveState={state => ({ lastProps: props }) }
shouldUpdate={(state, nextState) => ... }
didMount={(state, setState) => ... }
getSnapshotBeforeUpdate={state => ... }
didUpdate={(state, setState, prevState, snapshot) => ... }
willUnmount={state => ... }
>
{(state, setState) => (
...
)}
</State>
);
}
@trueadm
Copy link
Author

trueadm commented Mar 23, 2018

Points:

  • Is React.createRef() the best API for this? Is it confusing that <State> has all the lifecycles?
  • I had an earlier draft of pulling out lifecycle events from the state but many feel this is just added noise and state and lifecycles belong together.
  • This really bodes well with my JSX sugar adopt syntax, it makes render props like above far less painful to use.
  • should initialState be initial? Should deriveState be derive? Does it matter?

@bvaughn
Copy link

bvaughn commented Mar 23, 2018

s/createRef/createState/

@bvaughn
Copy link

bvaughn commented Mar 23, 2018

should initialState be initial? Should deriveState be derive? Does it matter?

Maybe initialValue but I don't think initial has enough meaning anything by itself. "Initial...what?".

I also think deriveState and initialState are fine as is.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment