1、现象

在用mobx做react的状态管理工具时，修改了数据的值。例如如下代码：

import { makeAutoObservable } from 'mobx'
import { http } from '@/utils'

class ChannelStore {
  channelList = []
  constructor() {
    makeAutoObservable(this)
  }

  loadChannelList = async () => {
    const res = await http.get('/channels')
    this.channelList = res.data.channels
  }
}

export default ChannelStore

2、修改方式

   MobX 是一个流行的 JavaScript 状态管理库，它允许你以简单直观的方式创建和管理应用的状态。在 MobX 中，有一个 strict-mode 的概念，当它被启用时，它会提供额外的运行时检查来确保你的应用代码遵循 MobX 的最佳实践。

使用 runInAction

import { makeAutoObservable, runInAction } from 'mobx'
import { http } from '@/utils'

class ChannelStore {
  channelList = []
  constructor() {
    makeAutoObservable(this)
  }

  loadChannelList = async () => {
    const res = await http.get('/channels')
    runInAction(
      () => {
        this.channelList = res.data.channels
      }
    )
  }
}

export default ChannelStore