Skip to content

Instantly share code, notes, and snippets.

@vovkasm
Created August 13, 2019 11:41
Show Gist options
  • Save vovkasm/2ef052cb1058f200770c0b07b477f1d8 to your computer and use it in GitHub Desktop.
Save vovkasm/2ef052cb1058f200770c0b07b477f1d8 to your computer and use it in GitHub Desktop.
Properties of Mobx actions.
Increment without transaction
before incrementCounter cnt=0
after incrementCounter cnt=1
reaction computed=1
reaction cnt=1
Two increments with transaction
before incrementCounter cnt=1
after incrementCounter cnt=2
Current immediate value in transaction cnt=2
before incrementCounter cnt=2
after incrementCounter cnt=3
reaction computed=3
reaction cnt=3
import { action, computed, observable, reaction, runInAction } from 'mobx'
class Store {
@observable cnt: number = 0
@computed get counter() {
return this.cnt
}
@action incrementCounter() {
console.log(`before incrementCounter cnt=${this.cnt}`)
this.cnt++
console.log(`after incrementCounter cnt=${this.cnt}`)
}
}
const store = new Store()
reaction(
() => store.cnt,
(cnt) => {
console.log(`reaction cnt=${cnt}`)
},
)
reaction(
() => store.counter,
(cnt) => {
console.log(`reaction computed=${cnt}`)
},
)
console.log(`Increment without transaction`)
store.incrementCounter()
console.log(`Two increments with transaction`)
runInAction(() => {
store.incrementCounter()
console.log(`Current immediate value in transaction cnt=${store.counter}`)
store.incrementCounter()
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment