Tried to make counter with next-redux-wrapper, redux, Next.js.
I've watched that when I clicked few counter button, then move to other page and came back to counter page, getServerSideProps
initializes the counter into 3 again. I understand this library as it helps merge the result of dispatch during SSR to client redux store, but does not sync client store state to server redux store.
Did I understand it correctly?
Here is my code of counter app
index.tsx
export const getServerSideProps = wrapper.getServerSideProps(
(store) => async () => {
store.dispatch(add(3));
return {
props: {},
};
}
);
const index = (props: any) => {
const count = useSelector((state: AppState) => state.counter.count);
const dispatch = useDispatch();
return (
<>
<Link href='/book'>// move to other page then come back
<a>move</a>
</Link>
<div>{count}</div>
<button onClick={() => dispatch(add(1))}>+</button>
<button onClick={() => dispatch(deleter(2))}>-</button>
</>
);
};