Stack Overflow
Stack Overflow

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.

850 questions
5
votes
0 answers

mobx-react-form with dynamic fields

We use mobx-react-form (https://github.com/foxhound87/mobx-react-form) for our forms. One of our forms has a multi select dropdown. according to the selection, fields are added / removed from the form. How can this be managed in mobx-react-form?
Mattan Bitner
  • 1,463
  • 3
  • 14
  • 29
5
votes
1 answer

"Object is possibly undefined" in for observable field

Retrieve data and set obseravble array, here is code below: import {observable} from 'mobx'; export interface IMenuModel{ Id:number itemName:string; parentId?:number; } class MenuRepo { @observable menuItems? : IMenuModel[]; …
TyForHelpDude
  • 4,828
  • 10
  • 48
  • 96
5
votes
1 answer

How to set new values to whole MobX observable array

In MobX how can I set new values to a whole observable array without re-setting every value? First thought would be: let arr = observable([]); autorun(() => { console.log('my array changed!'); }); arr = ['foo', 'bar']; But that would not fire the…
Sergio
  • 28,539
  • 11
  • 85
  • 132
5
votes
2 answers

mobx: array.map() is not a function

I have created a store using mobx as follows: import {extendObservable} from 'mobx'; class InfluencerFeedStore { constructor() { extendObservable(this, { data: [] }); } setData(items = []) { …
arthurakay
  • 5,631
  • 8
  • 37
  • 62
4
votes
1 answer

How do I update mobx observables atomically?

I have a store myStore which has a main method which invokes multiple methods which are setting observale value in mobx. My problem is I want to re-render my react component only after ALL the observables are set. can I make the main method @action,…
Prashant
  • 122
  • 7
4
votes
0 answers

Usage of mobx in custom react hooks

We're using custom hooks in our app to invoke automatic analytics/general hooks which using const user = useObserver(() => userStore.user); to dispatch analytics (lifecycles of components/general usages) But I have seen that useObserver hook of mobx…
Daniel Amram
  • 51
  • 4
4
votes
1 answer

What's the difference between useObserver and observer in this application?

I have a react functional component that accesses the MobX store with useContext. I have found two ways to observe an array that is an observable from the store. First, the useObserver hook and wrapping the component with observer. I thought that…
KubiGR
  • 41
  • 3
4
votes
1 answer

TypeError when using `useLocalObservable` from MobX to work with TypeScript?

I'm basically following this video which points to this repo to convert my app to use MobX v6. I'm using useLocalObservable as useLocalStore is deprecated in MobX v6. The error I get is on FrameItStore inside of useLocalObservable: Argument of type…
deadcoder0904
  • 7,232
  • 12
  • 66
  • 163
4
votes
2 answers

Mobx - when to use useLocalStore hook with react-mobx

I don't get why useLocalStore hook exist. I am declaring stores outside of the React component body using the observable method imported from mobx lib. Then, every component that uses the store in any way is wrapped into observer HOC from…
feerlay
  • 2,286
  • 5
  • 23
  • 47
4
votes
2 answers

When 'action'/'runInAction' is really needed in mobx react

Can someone explain to me what is the real difference and why both of the example here are working the same: 1) Change a state of observable via action/runInAction inside the store file: colorStore file: @observable color='red' @action setColor(){ …
U.Rush
  • 398
  • 2
  • 7
4
votes
1 answer

Array splice is not observed by mobx

I have defined an action for removing an item from an array: export default class myStore { @observable items = []; ... ... @action deleteItem = async (target) => { try { await backendService.deleteItem(target.id); …
HTB
  • 413
  • 1
  • 9
  • 22
4
votes
1 answer

How can I observe any change (property added, removed or changed) in a mobx observable map?

class FilterCriteria { @observable filter = new Map(); } let criteria = new FilterCriteria (); // setting up a reaction when something in the filter changes // (property added, removed, or changed) reaction(()=>criteria.filter, data =>…
Thanasis Ioannidis
  • 2,981
  • 1
  • 30
  • 50
4
votes
0 answers

Computed method with parameters in mobx

Suppose I have an object ResourceX that looks like this. interface ResourceX { id: string, type: string, label: string } I also have a backend API, that allows me to fetch a ResourceX with a certain id (resourceService.get(123) = Resource…
Skilla123
  • 81
  • 1
  • 1
  • 7
4
votes
0 answers

Storybook breaks MobX/MobX-React?

I've confirmed it 100% although I cannot diff the node_modules to determine how. But here's the issue. Versions: "react": "^16.6.3", "react-dom": "^16.6.3", "mobx": "^5.6.0", "mobx-react": "^5.4.2" "devDependencies": { …
Franklinc
  • 423
  • 1
  • 3
  • 11
4
votes
1 answer

Redux/MobX - Do I need to pass data in child components via props in React?

I know It may sound like a dumb question, But I am not able to get this solved in my head. Please bear with me. In case when we use a state management system in React like Redux / Mob X, I guess the main purpose of these state management techniques…
Lalit Jethani
  • 51
  • 4
1 2 3
…
56 57