React Native NetInfo'handers不是函数'错误代码

Question

我按照'HandlerBar Labs'的教程“使用Redux Persist保存数据”。在练习应用程序中一切正常，但当我尝试在我的实际应用程序中使用它时，我得到了错误。这是完整的错误消息：

这是我正在使用的一些代码..

我创建了一个网络动作和一个网络减速器，所以..

network_action.js：

export const CHANGE_CONNECTION_STATUS = 'CHANGE_CONNECTION_STATUS';

export const changeNetworkStatus = status => {
  return {
    type: CHANGE_CONNECTION_STATUS,
    status,
  };
};

network_reducer.js：

import { CHANGE_CONNECTION_STATUS } from '../actions/network_action';

const intitialState = {
  connected: false,
  hasCheckedStatus: false,
};


const isConnected = (status) => {
  if (status.toLowerCase() === 'none') {
    return false;
  }

  return true;
};


export default (state = intitialState, action) => {
  switch (action.type) {
    case CHANGE_CONNECTION_STATUS:
      return {
        ...state,
        hasCheckedStatus: true,
        connected: isConnected(action.status),
      }
    default:
      return state;
  }
}

然后在我的根app.js ..

import { Platform, AsyncStorage, NetInfo } from 'react-native';
import { changeNetworkStatus } from './redux/actions/network_action';

componentWillMount() {
    NetInfo.addEventListener('connectionChange', this.handleNetworkChange);
    };

const mapDispatchToProps = (dispatch) => {
  return {
    handleNetworkChange: (info) => { dispatch(changeNetworkStatus(info)); }
  };
};

这是我的package.json依赖项..

"dependencies": {
    "axios": "^0.16.2",
    "instabug-reactnative": "^2.0.18",
    "link": "^0.1.5",
    "prop-types": "^15.6.0",
    "react": "^16.0.0",
    "react-dom": "16.0.0-alpha.12",
    "react-native": "0.50.0",
    "react-native-auth0": "^1.2.1",
    "react-native-dotenv": "^0.1.0",
    "react-native-fontawesome": "^5.7.0",
    "react-native-google-analytics-bridge": "^5.3.3",
    "react-native-localization": "*",
    "react-native-splash-screen": "^3.0.1",
    "react-native-swipe-gestures": "^1.0.2",
    "react-navigation": "^1.0.0-beta.21",
    "react-redux": "^5.0.6",
    "redux": "^3.7.2",
    "redux-logger": "^3.0.6",
    "redux-persist": "4.10.2",
    "redux-thunk": "^2.2.0",
    "watchman": "^0.1.8"
  },
  "devDependencies": {
    "babel-eslint": "^7.2.3",
    "babel-jest": "20.0.3",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react-native": "^2.0.0",
    "enzyme": "^2.9.1",
    "eslint": "^3.19.0",
    "eslint-config-airbnb": "^15.1.0",
    "eslint-plugin-import": "^2.7.0",
    "eslint-plugin-jsx-a11y": "^5.1.1",
    "eslint-plugin-react": "^7.4.0",
    "eslint-plugin-react-native": "^3.1.0",
    "jest": "20.0.4",
    "react-test-renderer": "16.0.0-alpha.12"
  },

希望有足够的细节，谢谢你的帮助！

Answer 1

试试这个 ：

NetInfo.addEventListener('connectionChange', this.props.handleNetworkChange);

（this.props.handleNetworkChange而不是this.handleNetworkChange因为redux mapDispatchToProps将你的函数映射到组件道具）