可以看出,如果是 Function component,mobx-react 引用了 mobx-react-lite 的 observer 方法。 mobx-react\src\observer.tsx import{observerasobserverLite}from"mobx-react-lite"exportfunctionobserver<TextendsIReactComponent>(component:T):T{...// Function componentif(typeofcomponent==="function"&&(!component...
import{observer}from"mobx-react-lite"// Or "mobx-react". constMyComponent=observer(props=>ReactElement) MobX 可以独立于 React 运行, 但是他们通常是结合在一起使用, 在Mobx的宗旨(The gist of MobX)一文中你会经常看见集成React最重要的一部分:用于包裹React Component的observerHOC方法。
安装配置 yarn add mobx mobx-react yarn add babel-plugin-transform-decorators-legacy // webpack....
mobx-react 对外暴露了如下这些方法,其中一些 API 是来自于 mobx-react-lite 的,它是 mobx-react 的轻量版,增加了对函数式组件 hooks 的支持。 mobx-react\src\index.ts export{Observer,useObserver,useAsObservableSource,useLocalStore,isUsingStaticRendering,useStaticRendering,observerBatching,observerBatchingOptOu...
mobx-react-liteThis is a lighter version of mobx-react which supports React functional components only and as such makes the library slightly faster and smaller (only 1.5kB gzipped). Note however that it is possible to use <Observer> inside the render of class components. Unlike mobx-react,...
// use mobx-react@6.1.2 or `mobx-react-lite`import{useObserver}from'mobx-react'functionuseUserData(){const{user,order}=useStores()returnuseObserver(()=>({username:user.name,orderId:order.id,}))}constUserOrderInfo=()=>{// this works now just fineconst{username,orderId}=useUserData()r...
Intended outcome: Expected to be able to render a component that is exported as observer(Component, {forwardRef: true}) Actual outcome: Get error: How to reproduce the issue: Make a component that uses React.forwardRef, then export that ...
Hi, I'm currently using mobx-react@6.1.1. I noticed that when I try to import observer, I could import it from either mobx-react or mobx-react-lite. I also notice that only the one from mobx-react-lite is the one I want to use as I'm using function component that needs forwardRe...
Local observable state can be introduced by using theuseLocalObservablehook, that runs once to create an observable store. A quick example would be: import{useLocalObservable,Observer}from"mobx-react-lite"constTodo=()=>{consttodo=useLocalObservable(()=>({title:"Test",done:true,toggle(){this...
使用useObserver(()=>JSX.Element)方法取代observer(()=>JSX.Element) 2: import{Observer, useLocalStore }from'mobx-react'; functionObservePerson() { constperson =useLocalStore(() =>({name:'John'})) return( {person.name}I will never change my name <Observer>{() ...