import React from "react"
import { observable } from "mobx";
import { observer } from "mobx-react"
import { computed, action } from "mobx"
@observer
export default class Dice extends React.Component {
@observable
value = 1;
@computed
get result() {
return this.value > 3 ? "YOU WIN" : "YOU LOSE"
}
@action
handleRoll = () => {
this.value = Math.floor(Math.random() * 6) + 1
}
render() {
return (
<div>
<br />
<button onClick = {this.handleRoll}>Roll Dice</button> <br />
<p>The value is {this.value}</p>
<p>{this.result}</p>
</div>
)
}
}Теперь я использовал декоратор действий для функции handleRoll. Я использовал его, потому что мое исходное состояние изменилось, то есть значение будет меняться каждый раз (скорее всего), когда я нажимаю кнопку броска кубика. Теперь, даже когда я удалил декоратор действия, все равно все работает нормально, без ошибок. Теперь вопрос в том, можем ли мы выполнить задачу по изменению состояния, тогда зачем вообще использовать действия?



![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)


По умолчанию использование действий не требуется для изменения состояния в mobx, но это [хорошая практика в больших базах кода | https://mobx.js.org/refguide/action.html#when-to-use-actions]. Если вы включите строгий режим, mobx выдаст ошибку, если вы попытаетесь изменить состояние вне действия.
Чтобы включить строгий режим в mobx 4.0.0 и новее, используйте mobx.configure({enforceActions: true}). В более старых версиях mobx это выполнялось с помощью mobx.useStrict(true).