What is the best way to handle UI State in Meteor + React?

react
1

I’m learning how to use React with Meteor, and coming from Blaze I’m having difficulty passing data between unrelated, i.e. not parent to child, components to alter their states. What is the current best practise to do that? Can anyone share sample code for that?

I am exploring Redux, using the fabulous tutorial provided by @abhiaiyer but it feels like a completely foreign concept to the “Meteor way” albeit it being a very interesting approach to have predictable state in your app.

Are there simpler alternatives out there?

2

Since you’re asking for simpler alternatives, check out ViewModel.

I just found this blog post by @arggh (thanks for the shout-out) detailing his experience:

https://medium.com/@arggh/my-experience-with-viewmodel-meteor-d4c89ab7a353#.hvxl2lvqi

Here’s how you share state between components:
https://viewmodel.org/react#AdvancedShare

The code looks like this:

ViewModel.share({
  house: {
    address: ''
  }
})

ComponentA({
  share: 'house',
  render() {
    <div b="text: address" />
  }
})

ComponentB({
  share: 'house',
  render() {
    <div b="text: address" />
  }
})
3

You could use reactive vars etc: https://guide.meteor.com/data-loading.html#stores