React.js でflashメッセージを実装したい

Question

表題の質問になります。

ただいまポートフォリオを作成しており、Railsでよく見るフラッシュメッセージのようなものを作成したいです。
ページ遷移後に現れるような形にしたく、materialUIのSnackBarや、react-toastifyなどですと、ページ遷移すると表示が消えてしまうので、私の希望には沿いませんでした。
インターネットで調べてみたのですが、ライブラリもなく、さらに私自身に知識もなく止まってしまいました。
useHistoryを使用し、ページ遷移後の画面に表示したいです。

もし、ご存知の方がいらっしゃいましたらURLのリンクを貼っていただきたいです。
よろしくお願いします。

Answer 1

useHistoryを使用し、ページ遷移後の画面に表示したいです。

とのことなので、多分react-routerを使っていると思います。
であればhistory.push()の第２引数にプロパティを渡せば遷移後のページに値を渡すことができると思います。

＜参考＞

• There is same this problem in StackOverFlow
• react-router's Document

これ以外の方法としては、localStorageを使ってflashをするようなCustomHookを自作するとかでしょうか・・・

Comments

[Tatsu0219]

第二引数にプロパティが渡せるのは初耳でした、、！
useContextで状態を共有し代用していましたが、そちらで実装してみようと思います！！

ありがとうございます。