アプリの起動時にreduxでフェッチを開始するにはどうすればよいですか?

ダンクス

通知用の簡単なカウンターを設定した後。アプリの開始時に通知を取得して、受信した通知の数を表示したいと思います。

構成は次のとおりです。reducer:

index.js

import { combineReducers } from "redux";
import posts from "./posts";
import filteredPosts from "./filteredPosts";
import notifications from "./notifications";

export default combineReducers({
  posts,
  filteredPosts,
  notifications
});

notify.js

import * as types from "../actions/types";
const initialState = [];

export default (state = initialState, action) => {
  switch (action.type) {
    case types.LOAD_NOTIFICATIONS:
      return action.notifications;
    default:
      return state;
  }
};

行動

type.js

export const FILTERED_POST = "FILTERED_POST";
export const LOAD_POSTS = "LOAD_POSTS";
export const LOAD_NOTIFICATIONS = "LOAD_NOTIFICATIONS";

notify.js

import * as types from "./types";
import { fetchNotifications } from "../service/";

export const getNotifications = auth_token => dispatch =>
  fetchNotifications(auth_token)
    .then(res => {
      return res.json();
    })
    .then(data => {
      dispatch({
        type: types.LOAD_NOTIFICATIONS,
        notifications: data.notifications
      });
    })
    .catch(err => {
      console.log(err);
    });

そしてサービス

index.js

import { apiEndpoint } from "./config";

export const fetchPosts = auth_token =>
  fetch(`${apiEndpoint}posts`, {
    method: "GET",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
      Access: auth_token
    }
  });

export const fetchNotifications = auth_token =>
  fetch(`${apiEndpoint}notifications`, {
    method: "GET",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json",
      Access: auth_token
    }
  });

apiEndpointはAPIアドレスです。したがって、通知バッジコンポーネントを構成してルーターに追加した後、アプリは投稿を読み込みます。これは、ホーム画面であり、通知ではないためです。

確認するには、通知バッジコンポーネントをホーム画面として配置し、最初に読み込んでも通知を受け取らないようにしました。だから、誰かがアプリの起動時またはその前または直後に使用reduxをフェッチする方法を明確にすることができますか?

export const Logged = createBottomTabNavigator(
  {
    Notification: {
      screen: Notification,
      navigationOptions: {
        tabBarLabel: "Notification",
        tabBarIcon: () => {
          <NotificationIcon />;
        }
      }
    },
チャド・ネヘミア

間違っている可能性のあることがいくつかあります。まず、postmanなどのツールを使用してエンドポイントからの応答を確認します。応答が期待どおりである場合は、ルートコンポーネントを作成することをお勧めAppComponentします。mapDispatchToPropsを使用componentDidMountしてgetNotificationsアクションをディスパッチできます

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

mvvm / wpfでアプリの起動時にbgスレッドを開始するにはどうすればよいですか?

分類Dev

Androidアプリケーションの起動時にサービスを開始するにはどうすればよいですか?

分類Dev

Ubuntuの起動時にconkyを開始するにはどうすればよいですか?

分類Dev

Ubuntuの起動時にインタラクティブスクリプトを開始するにはどうすればよいですか?

分類Dev

/etc/init.dのスクリプトを起動時に開始するにはどうすればよいですか?

分類Dev

プログラムの起動時にC ++スレッドを開始するにはどうすればよいですか?

分類Dev

アプリの起動時にのみ通知を作成するにはどうすればよいですか?

分類Dev

起動時に開始するサービスを作成するにはどうすればよいですか?

分類Dev

アプリの起動時に変数を初期化するにはどうすればよいですか?

分類Dev

起動時にフラッターでアプリを起動するにはどうすればよいですか?

分類Dev

イオンアプリケーションの開始時にポップアップを使用するにはどうすればよいですか?

分類Dev

長押しジェスチャーの開始時にアニメーションを開始するにはどうすればよいですか?

分類Dev

起動時にBackgroundtaskを開始するにはどうすればよいですか?

分類Dev

golangアプリケーションの起動プロセスを開始するにはどうすればよいですか?

分類Dev

ReactアプリのDockerでのデプロイ時にフェッチベースURLを構成するにはどうすればよいですか?

分類Dev

起動時にGoogleChromeでさまざまなプロファイルを開始するにはどうすればよいですか?

分類Dev

起動時にスナップが開始されないようにするにはどうすればよいですか?

分類Dev

Seamアプリケーションの開始時にプロセスを開始するにはどうすればよいですか?

分類Dev

アプリケーションがフェッチし、フェッチしたデータをアプリケーションに渡した後、新しいアクティビティを開始するにはどうすればよいですか?

分類Dev

アプリの起動時にフレームワークのコードを自動的に実行するにはどうすればよいですか?

分類Dev

アプリケーションの終了時に閉じないスレッドを開始するにはどうすればよいですか?(Qt C ++)

分類Dev

Qt / QML Androidアプリの起動時にすぐにスプラッシュ画面を表示するにはどうすればよいですか?

分類Dev

アプリの起動時にXamarinフォームでこの非同期メソッドを呼び出すにはどうすればよいですか?

分類Dev

15.10の起動時にLXCコンテナーを開始するように設定するにはどうすればよいですか?

分類Dev

USB接続時にアプリを起動するにはどうすればよいですか?

分類Dev

Windowsの起動時にバッチファイルを自動起動するにはどうすればよいですか

分類Dev

Emacsの起動時にファイルを自動的に開くにはどうすればよいですか?

分類Dev

React NativeでUWPアプリの作成を開始するにはどうすればよいですか?

分類Dev

.net Core 3 WPFアプリでMvvmLightの使用を開始するにはどうすればよいですか?

Related 関連記事

  1. 1

    mvvm / wpfでアプリの起動時にbgスレッドを開始するにはどうすればよいですか?

  2. 2

    Androidアプリケーションの起動時にサービスを開始するにはどうすればよいですか?

  3. 3

    Ubuntuの起動時にconkyを開始するにはどうすればよいですか?

  4. 4

    Ubuntuの起動時にインタラクティブスクリプトを開始するにはどうすればよいですか?

  5. 5

    /etc/init.dのスクリプトを起動時に開始するにはどうすればよいですか?

  6. 6

    プログラムの起動時にC ++スレッドを開始するにはどうすればよいですか?

  7. 7

    アプリの起動時にのみ通知を作成するにはどうすればよいですか?

  8. 8

    起動時に開始するサービスを作成するにはどうすればよいですか?

  9. 9

    アプリの起動時に変数を初期化するにはどうすればよいですか?

  10. 10

    起動時にフラッターでアプリを起動するにはどうすればよいですか?

  11. 11

    イオンアプリケーションの開始時にポップアップを使用するにはどうすればよいですか?

  12. 12

    長押しジェスチャーの開始時にアニメーションを開始するにはどうすればよいですか?

  13. 13

    起動時にBackgroundtaskを開始するにはどうすればよいですか?

  14. 14

    golangアプリケーションの起動プロセスを開始するにはどうすればよいですか?

  15. 15

    ReactアプリのDockerでのデプロイ時にフェッチベースURLを構成するにはどうすればよいですか?

  16. 16

    起動時にGoogleChromeでさまざまなプロファイルを開始するにはどうすればよいですか?

  17. 17

    起動時にスナップが開始されないようにするにはどうすればよいですか?

  18. 18

    Seamアプリケーションの開始時にプロセスを開始するにはどうすればよいですか?

  19. 19

    アプリケーションがフェッチし、フェッチしたデータをアプリケーションに渡した後、新しいアクティビティを開始するにはどうすればよいですか?

  20. 20

    アプリの起動時にフレームワークのコードを自動的に実行するにはどうすればよいですか?

  21. 21

    アプリケーションの終了時に閉じないスレッドを開始するにはどうすればよいですか?(Qt C ++)

  22. 22

    Qt / QML Androidアプリの起動時にすぐにスプラッシュ画面を表示するにはどうすればよいですか?

  23. 23

    アプリの起動時にXamarinフォームでこの非同期メソッドを呼び出すにはどうすればよいですか?

  24. 24

    15.10の起動時にLXCコンテナーを開始するように設定するにはどうすればよいですか?

  25. 25

    USB接続時にアプリを起動するにはどうすればよいですか?

  26. 26

    Windowsの起動時にバッチファイルを自動起動するにはどうすればよいですか

  27. 27

    Emacsの起動時にファイルを自動的に開くにはどうすればよいですか?

  28. 28

    React NativeでUWPアプリの作成を開始するにはどうすればよいですか?

  29. 29

    .net Core 3 WPFアプリでMvvmLightの使用を開始するにはどうすればよいですか?

ホットタグ

アーカイブ