Midwest Dev Chat

MidwestDevChat.com

  • The newest 15 messages in the super-cool #reactjs channel.

  • 01/17 08:56:17 Giuseppe: e.g. going to the counter example given in pretty much every doc - how would I have the counter display appear in one component and have a reset button in a functional component in an entirely different branch of the tree?
  • 01/17 09:12:08 Giuseppe: I tried putting the `useState` call into a common function that both components import, but that doesn't seem to do the trick. Should I be using something other than `useState`? I see there are things for more reduxy-type state as well...
  • 01/17 09:46:52 Zackary: your question doesnt sound like a hook specific problem. even without using hooks, i would lift that state to a component that is higher in the tree so that it is a parent of both of the components that need access to that state. then pass state and handlers down from there to those other components as props
  • 01/17 09:48:00 Zackary: is that in line with what you are needing, or is there something about this situation that is beyond what im thinking about?
  • 01/17 11:02:53 Giuseppe: I think there is... I think that there is an approach advocated with hooks, and I think I saw it one time, but can't find it again
  • 01/17 11:03:37 Giuseppe: I know you can use contexts to share that kind of state, but I think there's a way of composing smaller hooks to make a larger hook that can be shared... I think ...
  • 01/17 11:13:30 Zackary: custom hooks do exist, but hooks are still targeted at individual components, unless you do use context. sharing state between components is still usually best to handle by lifting it higher and passing props down. i would recommend avoiding over use of context if it isnt necessary
  • 01/17 11:15:15 Zackary: the benefit of custom hooks is more about composing multiple core hooks together into something more useful for your particular app than about sharing state
  • 01/17 11:15:26 Zackary: here are the docs for custom hooks tho: https://reactjs.org/docs/hooks-custom.html#extr...
  • 01/17 11:16:07 Zackary: a key quote from the docs: > Do two components using the same Hook share state? No. Custom Hooks are a mechanism to reuse stateful logic (such as setting up a subscription and remembering the current value), but every time you use a custom Hook, all state and effects inside of it are fully isolated.
  • 01/17 11:18:06 Giuseppe: Interesting... so I was under the impression that this was going to be something of a redux killer, giving you the ability to pick up some global state anywhere in your tree
  • 01/17 11:18:21 Giuseppe: But it sounds like I'm wrong then
  • 01/17 11:59:56 Sonny: I think you're looking for the Context API, it's dope. https://reactjs.org/docs/context.html
  • 01/17 12:01:29 Sonny: Hooks are an alternative to the Higher Order Component Pattern, and the Render Props pattern. Redux basically is synonymous with Higher Order Component to an extent.
  • 01/17 12:04:31 Sonny: Edit: I agree with not over-using Context and passing props down as said above, but context is still really cool and useful for the right problems.
  • *Usernames have been changed to protect the innocent.
We're currently 1132 members strong. Join us!
Request Invite

Check out all the cool channels!

Join the conversation!