如果我有這樣的代碼
<button onClick = {()=>{
store.increment()
console.log(store.count)
}
}>{store.count}</button>
然后當你點擊按鈕時，計數器會更新，并且計數器已經在控制臺中更新了。但是如果你創建一個接受數量和回呼的 Counter 組件，狀態將是異步的
<Counter count = {store.count} increment = {store.increment}/>
如何確保控制臺中的狀態已更新。如果可能，沒有 didUpdate 方法和更新鉤子
代碼沙盒https://codesandbox.io/s/mobx-counter-example-forked-v3qcrw?file=/src/index.js
uj5u.com熱心網友回復：
首先：不要使用過時的庫版本。將它們更新到最新版本。
第二：將observableapi 改為makeAutoObservable，去掉多余的actions。
第三：將每個使用可觀察值的組件包裝到observerHOC 中。在您的示例中，您包裝了Counter，但 Counter 實際上不使用任何可觀察值，它僅appState.count作為道具獲取，當您參考它時它將成為原始值。然后你將 Counter 直接傳遞給 ReactDOM.render，這是行不通的。
我已經用App組件包裝了它：
const App = observer(() => {
return <Counter count={appState.count} increment={appState.incCounter} />;
});
這是帶有作業代碼的Codesandbox
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/437408.html
上一篇：了解如何使存盤庫查詢異步