使用

1. 下载mobx库和mobx-react-lite库
2. 创建store.js

import { observable, action,makeAutoObservable } from 'mobx';class BookStore{bookList=[];count=0;constructor(){makeAutoObservable(this); //使变量自动变成observerable变量}add=()=>{this.count++;}addBook=(book)=>{fetch('/book/add')}getBookList=()=>{fetch('/book/list')}}}
let bookStore=new BookStore();
export default bookStore

3.在react组件中observer包裹

import { observer } from 'mobx-react-lite';
const BookList= observer(() => {return()
})

注意事项

 1.mobx里的observer变量必须放在react render组件里才会刷新{/* render的组件里必须有mobx store的值才会刷新 */}return (<Button onClick={()=>{localUserStore.add()}}>{localUserStore.count}</Button>
)2.非基础类型需要用toJs转换
在store.js定义
data={"id":1,"name","abc"}
在react中使用
toJs(store.data)3.请求初始化数据在UseEffect中执行useEffect(() => {bookStore.getBorrowList();}, []);

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！