pinqy520 / mobx-persist

persist mobx stores
MIT License
560 stars 62 forks source link

Persist an Array in @observable Array #73

Open saeid85 opened 5 years ago

saeid85 commented 5 years ago

There is a scenario which I confused how to do it using mobx-persist.

I have a list (Array) of users & I want to store an object per user. Inside user object I need to store another list (Array) call Orders and each Order is an Object itself.

users = []
user={
   id: 1,
   name: "John",
   family: "Doe",
   orders:[],
   ...
}
order={
   id: 1,
   ...
}

I created a store like this:

import { observable, computed } from "mobx";
import { persist } from "mobx-persist";

class usersStore {
  @persist("list")
  @observable
  users = [];

  addUsers(userFirstName, userLastName) {
    this.users.push({
      id: this.generateId(),
      addedDate: new Date(),
      userFirstName,
      userLastName,
      orders: []
    });
  }

  addOrder(id, order) {
    this.users.filter(asset => asset.id === id)[0].orders.push(order);
  }
}

const usersStore = new UsersStore();
export default usersStore;

adduser() pushes an object for a new user into the users array and addOrder() pushes an object for a new order into the orders array.

This approach works fine but the only issue is, it persists users list (with all objects in it) but it doesn't persist Orders list in user object.

What should I do in order to be able to persist orders list in user object?

Thanks

doKill commented 5 years ago

same question

doKill commented 5 years ago

@saeid85 do u resolve it?

saeid85 commented 5 years ago

I found a solution & it works.

class Order {
  @persist @observable id = 0;
  @persist @observable amount = "";
  @persist("object") @observable date = {};
}

class User {
  @persist @observable id = 0;
  @persist @observable name = "";
  @persist @observable family = "";
  @persist("list", Transaction) @observable orders = [];
}

class UsersStore {
  @persist("list", Asset) @observable users = [];

  @action addUser(name, family) {
    this.assets.push(new User());
    this.assets[this.assets.length-1] = {
      id: (new Date).getTime(),
      name,
      family
      orders: []
    };
  }

  @action addOrder(id, order) {
    let user = this.users.filter(user => user.id === id)[0];

    user.orders.push(new Order());
    user.orders[user.orders.length-1] = {
      id: (new Date).getTime(),
      amount,
      date,
    };
  }
}

I hope it helps you.

doKill commented 5 years ago

@saeid85 thanks a lot , and i solve it by this way

Storage.get("offline").then(v => {
    Storage.update("offline",Object.assign(v, { projectList: this.projectList }));
});
saeid85 commented 5 years ago

Cool :)

mthuong commented 5 years ago

@saeid85

Why do you need to like this? user.orders.push(new Order());

user.orders[user.orders.length-1] = { id: (new Date).getTime(), amount, date, };

I had the same problem with a nested array in an array and it's not persisted.

mthuong commented 5 years ago

I realized that the problem is about the mobx v4 and v5 and IObservableArray