🚫

Piniaの$subscribeの制約?

に公開

direct mutation の $subscribe が来ないときがある..

Vue で Web アプリ勉強中です。

識者には well-known な話かもしれませんが、Piniaの $subscribe で state 更新してもコールバックが呼ばれないことがあるのにハマりました。どうやら direct と $patch による mutation を同じタイミングで行うと、$subscribe で direct のイベントを取りこぼしてしまうようです。同じ変数ならまだしも、更新するのがそれぞれ違う変数でもダメです。

該当してそうな github の Issue

Pinia の公式ドキュメントを読んでも分からなかったんですが、github で 2022 年にそれらしき Issueを発見。devtools を破綻させないための実装事情みたいなニュアンスのコメントがあるので、今もそのままなのですかね..
flush:sync を付ければ取りこぼさないようだけど、望まない粒度でコールバックが来るので、それで解決できるケースは少ないのでは。

現象確認用のテストアプリ

再現テスト用の簡単な Vue アプリを作ってみました。
説明とコードはgithub をご参照。

スクリーンショット

$subscribe 使うなら direct と$patch を混ぜるな

そもそも混ぜて使おうとした背景は、$subscribe のコールバック内で state をいじる必要があるのでネストしないように使い分けたかったからでした。でも取りこぼされると厄介なので、全部 $onAction で書き直し。

GitHubで編集を提案

Discussion