redux - 如何使用 redux 调度我的变量？

Question

我是 Redux 新手。 我意识到我需要调度来保存我们商店中的变量。 但是，我无法调度 device_token。 我尝试了“store.dispatch”。

这是 react native 代码。 然而，我认为这是唯一的 redux 问题。 我需要帮助。

我的代码如下。

// @flow
import { Component } from 'react';
import { Platform } from 'react-native';
import FCM, { FCMEvent, RemoteNotificationResult, 
WillPresentNotificationResult, NotificationType } from 'react-native-fcm';
import { connect } from 'react-redux';
import { getDeviceToken } from '../common/CurrentUser/actions';

const showLocalNotification = (notif) => {
  FCM.presentLocalNotification({
    title: notif.title,
    body: notif.body,
    priority: 'high',
    click_action: notif.click_action,
    show_in_foreground: true,
    local: true,
  });
};

export class PushNotification extends Component {
  constructor(){
    super();
  }

componentDidMount() {
  FCM.requestPermissions().then( () => {
    FCM.getFCMToken().then((token: string) => {
      const device_token = token;
      const { saveDeviceToken } = this.props;
      alert(device_token);
      dispatch(saveDeviceToken(device_token))
      //dispatch(getDeviceToken( { device_token }));
      alert(token);
    });
  });

  FCM.on(FCMEvent.RefreshToken, token => {
    alert(token);
  });


  this.notificationListner = FCM.on(FCMEvent.Notification, (notif: Object) => {
  if (notif.local_notification) {
    return;
  }
  if (notif.opened_from_tray) {
    return;
  }

  if (Platform.OS === 'ios') {
    switch (notif._notificationType) {
      case NotificationType.Remote:
        notif.finish(RemoteNotificationResult.NewData);
        break;
      case NotificationType.NotificationResponse:
        notif.finish();
        break;
      case NotificationType.WillPresent:
        notif.finish(WillPresentNotificationResult.All);
        break;
      default:
        break;
      }
    }
      showLocalNotification(notif);
    });
  }

  componentWillUnmount() {
    this.notificationListner.remove();
    this.refreshTokenListener.remove();
  }

  render() {
    return null;
  }
}

const mapDispatchToProps = (dispatch: Dispatch) => {
  return {
    saveDeviceToken: (token) => dispatch(getDeviceToken(token)),
  };
};

export default connect(mapDispatchToProps)(PushNotification);

//action.types.js

// @flow
import type { Action } from './actionTypes';
import type { User } from '../../entities';

export const SUCCESS_LOGIN = 'SUCCESS_LOGIN';
export const GET_DEVICE_TOKEN = 'GET_DEVICE_TOKEN';

export const successLogin = (payload: { user: User, authToken: string }): Action =>
  ({ type: 'SUCCESS_LOGIN', payload });

export const getDeviceToken = (payload: { device_token: string }): Action =>
  ({ type: 'GET_DEVICE_TOKEN', payload });

//reducer.js

export default (state: State = INITIAL_STATE, action: Action): State => {
  switch (action.type) {
  case 'GET_DEVICE_TOKEN':
    return {
      state,
    };
  default:
    return state;
  }
};

你有什么想法吗？ 我无法发送我的 device_token。 谢谢。

Answer 1

connect的第一个参数是mapStateToProps。如果你不需要将任何状态映射到 props，你可以将其更改为:

export default connect(null, mapDispatchToProps)(PushNotification);

这将绕过该参数并允许将 mapDispatchToProps 作为第二个参数传递。

然后你就可以像函数一样调用它的 props

componentDidMount() {
  FCM.requestPermissions().then( () => {
   FCM.getFCMToken().then((token: string) => {
      const device_token = token;
      const { saveDeviceToken } = this.props;
      saveDeviceToken(device_token);
    });
  });
}

请参阅API docs for more details .

---

我认为您也没有正确地将 device_token 传递给 getDeviceToken 操作创建者。尝试将 mapDispatchToProps 更改为如下所示

const mapDispatchToProps = (dispatch: Dispatch) => {
  return {
    saveDeviceToken: (token) => dispatch(getDeviceToken({ device_token: token })),
  };
};