Прокси в mobx -state-tree - PullRequest
Новая
       37

Прокси в mobx -state-tree

0 голосов
/ 15 апреля 2020

Я пытаюсь создать простое приложение для составления бюджета. Всякий раз, когда я вставляю эту модель в свое приложение. Я получаю прокси на расходы. В чем недостаток моего мышления?

У меня есть действие с бюджетом. js когда я печатаю его в useEffect, это то, что console.log выводит для расходов на прокси. Я ожидаю, что он напечатает фактические данные из исходного состояния. 


React.useEffect(() => {
    budget.addDummyData()
    console.log(budget.expenses)
  }, [])


[[Handler]]: Object
[[Target]]: Array(0)
[[IsRevoked]]: false


//////////////////////////////////////////////////////////////////////
//SubCategory
const SubCategory = types
  .model('SubCategory', {
    id: types.maybeNull(types.string, ''),
    name: types.maybeNull(types.string, ''),
    amount: types.maybeNull(types.number, 0)
  })
const SubCategoryStore = types.model({ subCategory: types.optional(SubCategory, {}) })
export default SubCategoryStore
/////////////////////////////////////////////////////////////////////////
//Category.js
const Category = types
  .model('Category', {
    id: types.maybeNull(types.string, ''),
    name: types.maybeNull(types.string, ''),
    subCategories: types.array(SubCategory)
  })
const CategoryStore = types.model({ category: types.optional(Category, {}) })
export default CategoryStore
///////////////////////////////////////////////////////////////
// Budget
const Budget = types
  .model('Budget', {
    totalIncome: 200,
    expenses: types.array(Category)
    // incomes: types.optional(types.array(Category), [])
  }).actions({
    addDummyData() {
      self.expenses.push(initialStateExpenses)
    }
})
const BudgetStore = types.model({ budget: types.optional(Budget, {}) })
export default BudgetStore


const initialStateExpenses = {
  id: '123',
  name: 'Food',
  subCategories: [
    {
      id: '1314',
      name: 'Grocery',
      amount: 250
    },
    {
      id: '1442',
      name: 'Restaurants',
      amount: 50
    }
  ]
}

1 Ответ

0 голосов
/ 21 апреля 2020

расходы относятся к типу Категория [], вы передаете объект. Я предполагаю, что вы хотите установить расходы от subCategories. Если это так, вы можете попробовать это 

    addDummyData() {
      initialStateExpenses.subCategories.forEach(ex => self.expenses.push(ex))
    }
or
    addDummyData() {
      self.expenses = initialStateExpenses.subCategories
    }

Лучше было бы передать initialStateExpenses через аргументы в функцию addDummyData, чтобы ваша модель не зависела от внешних переменных 

    addDummyData(initialStateExpenses) {
      initialStateExpenses.subCategories.forEach(ex => self.expenses.push(ex))
    }
or
    addDummyData(initialStateExpenses) {
      self.expenses = initialStateExpenses.subCategories
    }

then use it like
    budget.addDummyData(initialStateExpenses)
...