博客

使用的相关mobx版本

    "mobx": "^6.5.0",
    "mobx-react-lite": "^3.3.0",

store.js文件

import { makeAutoObservable, toJS,makeObservable, observable } from "mobx"

class DragStore {
    tabActive='1'
    constructor() {
      makeAutoObservable(this)
    }
    setTabActive(key) {
        this.tabActive= key
    }

}
const dragStore = new DragStore()
export default dragStore;;

解决方法用mobx-react-lite的observer包裹我们组件就可以驱动组件更新了

组件引入，包裹函数组件，类组件可能是引入@observer装饰器

import dragStore from '../../store/dragStore';
 import { observer } from "mobx-react-lite"‘
const myComponent = ()=>
{

return <div onClick={()=>{
 dragStore.tabActive= Math.random()
}}>111 {dragStore.tabActive}</div>
}
//下面用observer包裹组件
export default observer(myComponent)