Mobx: Observable array does not display correctly
Another way to log mobx observable is with toJS
method
import { toJS } from 'mobx';
class Store {
@observable
fruits = ['Apple', 'Banana'];
constructor() {
console.log('this.views :', toJS(this.data));
}
}
export default new Store();
Hope this help. Source
Figure out!
As stated in the docs
Bear in mind that Array.isArray(observable([])) will yield false, so whenever you need to pass an observable array to an external library, it is a good idea to create a shallow copy before passing it to other libraries or built-in functions (which is good practice anyway) by using array.slice() or array.peek(). So Array.isArray(observable([]).slice()) will yield true.
The doc exemple show us a todos.filter()
which could lead to confusion because todos
looks like a real JS Array. But it is not.
So for my exemple to work I just have to console.log(entities.slice())
which will display a real JS array.