Mobxjs/mobx-React-Lite readme.md file in github repository. Some of the deprecated apis are also in the example on the official website, which is difficult to understand.

Here is my Demo code to create 👇

// store
import { makeAutoObservable } from 'mobx'

const store = makeAutoObservable({
    data: {
        name: 'default name'
    },
    changeName: (val:string) = > (store.data.name=val)// action
})

export default store
Copy the code

Using 👇

// any component
import { observer } from 'mobx'

const Welcome = ( { store } ) = > {
    return <p> hello { store.data.name } </p>
}

export defalut observer(Welcome)// Observer returns a responsive component
Copy the code

Modify 👇

// any component
import store form '@/store'

const ChangeInput = ({ store }) = >{
    return <input onChange={ e= >store.changeName(e.target.value) }></input>
}

export defalut ChangeInput
Copy the code








Mobx6 code is simpler…