diff --git a/packages/react-meteor-data/CHANGELOG.md b/packages/react-meteor-data/CHANGELOG.md index 42d67b5e..7201a84e 100644 --- a/packages/react-meteor-data/CHANGELOG.md +++ b/packages/react-meteor-data/CHANGELOG.md @@ -1,5 +1,7 @@ # CHANGELOG +* Fix data was not correct saved between renders. + ## v2.2.2, 2021-01-28 * Fix lost reactivity when using deps. https://github.com/meteor/react-packages/pull/314 diff --git a/packages/react-meteor-data/useTracker.ts b/packages/react-meteor-data/useTracker.ts index 01063193..bd9472fd 100644 --- a/packages/react-meteor-data/useTracker.ts +++ b/packages/react-meteor-data/useTracker.ts @@ -104,7 +104,8 @@ const useTrackerNoDeps = (reactiveFn: IReactiveFn) => { } const useTrackerWithDeps = (reactiveFn: IReactiveFn, deps: DependencyList): T => { - let [data, setData] = useState(); + const dataRef = useRef(); + const forceUpdate = useForceUpdate(); const { current: refs } = useRef({ reactiveFn }); refs.reactiveFn = reactiveFn; @@ -114,20 +115,21 @@ const useTrackerWithDeps = (reactiveFn: IReactiveFn, deps: Dependenc // reactive function in a computation, then stop it, to force flush cycle. const comp = Tracker.nonreactive( () => Tracker.autorun((c: Tracker.Computation) => { - if (c.firstRun) data = refs.reactiveFn(); + if (c.firstRun) dataRef.current = refs.reactiveFn(); }) ); // To avoid creating side effects in render, stop the computation immediately Meteor.defer(() => { comp.stop() }); if (Meteor.isDevelopment) { - checkCursor(data); + checkCursor(dataRef.current); } }, deps); useEffect(() => { const computation = Tracker.nonreactive( () => Tracker.autorun((c) => { - setData(refs.reactiveFn(c)); + dataRef.current = refs.reactiveFn(c); + forceUpdate(); }) ); return () => { @@ -135,7 +137,7 @@ const useTrackerWithDeps = (reactiveFn: IReactiveFn, deps: Dependenc } }, deps); - return data as T; + return dataRef.current as T; } const useTrackerClient = (reactiveFn: IReactiveFn, deps: DependencyList = null): T =>