検索

ホームページ  >  に質問  >  本文

React-Toastify コンポーネントは再利用可能です

再利用可能な Toast コンポーネントを作成しようとしています。

コードは次のとおりです: https://codesandbox.io/s/custom-toastify-toast-with-react-component-forked-mu2l9c?file=/src/Toast.js:146-680

Toast コンポーネント自体をレンダリングするとき [以下のコメント] では、トーストが美しくポップアップ表示されます。

リーリー

ただし、パブリック toastMeta を使用してトーストへの呼び出しを実装しようとしています。この方法では、発信者は toastMeta.message("please show up..") と入力するだけでトーストを取得できます。オプションのパラメータの水平位置と垂直位置も渡されます。

問題: toastMeta.message("") を使用してトースト コンポーネントを呼び出すことができません

注: この CustomToast は npm パッケージになるため、呼び出し元はこのライブラリをインストールし、toastMeta をインポートする必要があります。

リーリー

キーストロークごとにトーストを呼び出す..

リーリー

Toast コンポーネントを作成する理由:

はパブリック ライブラリのコンポーネントの 1 つであるため、バージョン管理に使用されます。共通ライブラリには、すべての UI 要素が含まれています。

###助けてくれてありがとう。よろしくお願いします。

P粉514458863P粉514458863300日前415

全員に返信(1)返信します

  • P粉090087228

    P粉0900872282024-02-04 12:50:49

    オブジェクトを関数として呼び出すことはできません。これが実装が正しくない理由の 1 つです。トーストの ref を使用して、値を動的に渡す必要があります。

    コードを確認してください。お役に立てれば幸いです。

    App.js

    リーリー

    トースト.js

    リーリー

    返事
    0
  • キャンセル返事