mobx如何与react hooks配合使用

怕冷的火焰（~杰）

已于 2022-09-20 09:18:45 修改

阅读量1.1k

点赞数 1

分类专栏： React 文章标签： react.js

于 2022-03-02 13:36:42 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_50236973/article/details/123226757

版权

React 专栏收录该内容

30 篇文章

订阅专栏

import React from 'react';
import {useObserver, Observer， observer} from 'mobx-react';
import {appStore} from './appStore';

// 方法1：
function Methods1() {
    return useObserver(() => (
        <div onClick={() => {appStore.count = 1}}>{appStore.count}</div>
    ))
}

// 方法2(Observer一定要用函数)：
function Methods2 () {
    return （
        <Observer>
            {() => <div onClick={() => {appStore.count = 1}}>{appStore.count}</div>}   
        </Observer>
    ）
}

// 方法3（推荐）：
export default observer(props => {
    return <div onClick={() => {appStore.count = 1}}>{appStore.count}</div>
})

想了解哪种性能好，可以参考：mbox - useObserver vs Observer vs observer - 简书