Как решить `реакция не определена` при использовании Mobx? - PullRequest
0 голосов
/ 15 апреля 2020

Я новичок в React и Mobx и слежу за онлайн-уроком.

В уроке сказано использовать reaction например:

reaction(() => list.totalPrice, () => changed++)

Но я просто получите ошибку ReferenceError: reaction is not defined.

Я не уверен, что это значит или как go заставить его работать (не могу найти что-нибудь об этом в Google или SO).

Согласно документации Mobx, я, кажется, правильно ее использую https://mobx.js.org/refguide/reaction.html

Кто-нибудь знает, что это значит?

Мой полный код:

import { getSnapshot, onSnapshot, onPatch } from "mobx-state-tree"
import { WishList, WishListItem } from "./WishList"

it("can create a new instance of a model", () => {
  const item = WishListItem.create({
    name: "some item name",
    price: 28.74,
  })

  expect(item.price).toBe(28.74)
  expect(item.image).toBe("")
  item.changeName("Narnia")
  expect(item.name).toBe("Narnia")

})

it("can create a wishlist", () => {
  const list = WishList.create({
    items: [
      {
        name: "another item name",
        price: 30.43
      } 
    ]
  })

  expect(list.items.length).toBe(1)
  expect(list.items[0].price).toBe(30.43)
})

it("can add new item to list", () => {
  const list = WishList.create()
  const states = []
  onSnapshot(list, snapshot => {
    states.push(snapshot)
  })

    list.add({
      name: "A new item",
      price: 10
    }
  )

  expect(list.items.length).toBe(1)
  expect(list.items[0].name).toBe("A new item")
  list.items[0].changeName("Hello world")
  expect(list.items[0].name).toBe("Hello world")

  expect(getSnapshot(list)).toMatchSnapshot()

  expect(states).toMatchSnapshot()

})


// Patches
it("can add new item to list - 2", () => {
  const list = WishList.create()
  const patches = []
  onPatch(list, patch => {
    patches.push(patch)
  })

    list.add({
      name: "A new item",
      price: 10
    }
  )

  list.items[0].changeName("Hello world 2")

  expect(patches).toMatchSnapshot()

})

// Views
it("can calculate the total price of a wishlist", () => {
  const list = WishList.create({
    items: [
      {
        name: "Machine gun preacher",
        price: 11,
        image: ""
      },
      {
        name: "lego",
        price: 100,
        image: ""
      }
    ]
  })

  expect(list.totalPrice).toBe(111)

  let changed = 0
  reaction(() => list.totalPrice, () => changed++)

  expect(changed).toBe(0)
  console.log(list.totalPrice)
  list.items[0].changeName("test")
  expect(changed).toBe(0)
  list.items[0].changePrice(10)
  expect(changed).toBe(1)

})

1 Ответ

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

В учебнике исключена часть о добавлении

import { reaction } from "mobx"

...