Questions tagged [mobx-react]

MobX is a battle-tested library that makes state management simple and scalable

React and MobX together are a powerful combination. React renders the application state by providing mechanisms to translate it into a tree of renderable components. MobX provides the mechanism to store and update the application state that React then uses.

Both React and MobX provide optimal and unique solutions to common problems in application development. React provides mechanisms to optimally render UI by using a virtual DOM that reduces the number of costly DOM mutations. MobX provides mechanisms to optimally synchronize application state with your React components by using a reactive virtual dependency state graph that is only updated when strictly needed and is never stale.

746 questions
0
votes
1 answer

react getting observable values in component

Seting the obsrv array in the component below; class AnnouncementState { @observable categories =[]; constructor(){ this.getAnnouncementCategory(); } getAnnouncementCategory() { fetch(`..`) .then((response) => { …
TyForHelpDude
  • 4,032
  • 8
  • 41
  • 76
0
votes
3 answers

MobX Invariant failed: Side effects like changing state are not allowed at this point

I'm a JS/React/MobX/else newbie, trying to do something very simple without success. What I want is - 2 buttons, once clicked, show corresponding tab in a modal, using react-bootstrap and mobx. But I keep getting this error: [mobx] Encountered an…
Root
  • 1
  • 1
  • 2
0
votes
1 answer

Cannot access a variable inside the same class

I have a MobX store like the following Store class. When I want to access this.user.permits.db, I receive an error that this.user is undefined. I wonder why I cannot access the @observable user. src/ui/store/store.js file: import { action,…
user3405291
  • 5,371
  • 3
  • 32
  • 81
0
votes
1 answer

Warning: flattenChildren(...): Encountered two children with the same key in React Mobx Component

I am getting this error in my MobX React component: Warning: flattenChildren(...): Encountered two children with the same key, `1:$8`. Child keys must be unique; when two children share a key, only the first child will be used. This error message…
pyprism
  • 2,644
  • 9
  • 39
  • 73
0
votes
2 answers

Get observed variable from another component and redraw when changed

In my project I have two nodes (svg boxes) and a connection between them (arrow). Node is a components, that is initialized by passing x and y coordinates as a props: let nodes = []; nodes.push(); nodes.push(
kaytrance
  • 2,477
  • 3
  • 24
  • 44
0
votes
1 answer

Why mobx inject needs to use react's context?

What are the potential issues to implement a @inject decorator which does not depend to mobx-react's Provider component (which stores its properties in react's context)? The usage of the inject would be something like this: // MyComponent.js import…
alisabzevari
  • 7,178
  • 6
  • 38
  • 60
0
votes
0 answers

Mobx components re-rendering of components after state changes

I'm introducing Mobx in my React application. The application was not using any framework(Flux Redux, etc). On each component i first inject the state using the inject decorator of the mobx-react package: const React = require('react'); import…
Riccardo
  • 1,290
  • 11
  • 20
0
votes
0 answers

Reacting to changes within observed object's unobserved properties

I have an external library with TypeScript class instances in observed variable of my app's store: class Store: @observable active_obj:ExternalClass; This instance has a method which, when called, updates its internal state leaving the object…
jarpineh
  • 79
  • 1
  • 2
  • 9
0
votes
1 answer

Mobx invoke Action on Computed property

this is the code: @computed get user() { if(!this.hasValidated) this.reloadUserData(); return this.userData; } @action reloadUserData() { return new Promise(function(ok, err) { …
Chris Qiang
  • 194
  • 3
  • 14
0
votes
0 answers

React - Handle event in parent component

I am using a couple of generic components to promote reusability such as list, button, table etc. These components all have a controller class which is used to handle all the properties between the same group of components such as listItem,…
0
votes
1 answer

Export and import observable MobX React Native

I am new to React Native and very new to MobX, only realising i needed it when my first project demanded dynamically updating and changing props/store between files. Here is the github of the project: https://github.com/Kovah101/GenreGeneratorv1 I…
0
votes
1 answer

MobX passing simple array from observable to observer

I am new to MobX and was recommended it here. I have a simple array which I am trying to pass to another file. I have tried many things but I am unable to receive the array in the form of this.props.store If you could shine some light on my improper…
onAsilver road
  • 99
  • 1
  • 1
  • 4
0
votes
1 answer

How to append lat/lng in react-google-maps to this.state.markers

I've implemented in this: populateLocations() { var arrOfAdds = [], geocoder = new google.maps.Geocoder() this.props.properties.map(function(property, i) { if (geocoder) { geocoder.geocode({ 'address':…
Alex Ung
  • 69
  • 2
  • 10
0
votes
0 answers

MobX Gulp error by using Annotations (Decorators)

I have this basic React (MobX) store. Gulp runs normally but I still get error in browser (Uncaught TypeError: Cannot read property 'apply' of undefined). I tested everything and if I don't add the @observable then it works. In the generated js file…
alap
  • 625
  • 1
  • 11
  • 23
-1
votes
1 answer

String variable doesn't rendered

I have a variable I wanna be reactive. Example is simple: user types in an email's input, value reactively renders on the page. But it doesn't happens :( Variable's value changed, but doesn't rendered. Example on codesandbox. Thank you!
MegaBomber
  • 51
  • 1
  • 1
  • 7
1 2 3
49
50