reducer更新状态后状态未更新

Question

我正在尝试从App.js获取数据以获取网络连接可用性。 我正在从App.js获取数据以进行操作和reducer，但是reducer并未更新组件的状态。 reducer中的控制台日志正在运行，但是我无法在myComponent的mapStateToProps中获取数据。 我的App.js文件包含此代码。

import React, { Component } from 'react';
import { Provider } from 'react-redux';
import { NetInfo } from 'react-native';
import { createStore, applyMiddleware } from 'redux';
import ReduxThunk from 'redux-thunk';
import reducers from './src/reducers';
import Router from './src/Router';
import { internetConnectionChanged } from './src/actions/';

class App extends Component {
 componentWillMount() {
  NetInfo.isConnected.addEventListener('connectionChange', this.handleConnectionChange);
 }

componentWillUnmount() {
 NetInfo.isConnected.removeEventListener('connectionChange', this.handleConnectionChange);
}

handleConnectionChange = (isConnected) => {
 NetInfo.isConnected.fetch().done(
(isConnecteds) => {
  const store = createStore(reducers, {}, applyMiddleware(ReduxThunk));
  store.dispatch(internetConnectionChanged(isConnecteds));  
});
};
render() {
 const store = createStore(reducers, {}, applyMiddleware(ReduxThunk));
  return (
  <Provider store={store}>
      <Router />
  </Provider>
  );
 }
}

export default App;

我在操作文件中的代码是

import { CONNECTION_CHANGE } from '../actions/types';

export const internetConnectionChanged = (isConnected) => {
 return {
   type: CONNECTION_CHANGE,
  payload: isConnected
 };
};

那是通过动作文件的index.js通过export * from './AppActions';

减速器的代码是

import { CONNECTION_CHANGE } from '../actions/types';

const INITIAL_STATE = { isConnected: false };

export default (state = INITIAL_STATE, action) => {
 switch (action.type) {
  case CONNECTION_CHANGE:
  console.log(action.payload);
  return { ...state, isConnected: action.payload };
  default:
  return state;
 }
};

在我的组件下，这是获取信息的代码是

const mapStateToProps = ({ auth, app }) => {
const { email, password, error, loading } = auth;
const { isConnected } = app;
return { email, password, error, loading, isConnected };
};

export default connect(mapStateToProps, {
 emailChanged,
 passwordChanged,
 loginUser,
 forgotPasswordAction,
 })(LoginForm);

Answer 1

在App类之外创建商店。 这可能导致商店始终具有初始reducer值。 只需在Class App extends Component行之前粘贴以下行

 const store = createStore(reducers, {}, applyMiddleware(ReduxThunk));

还要从以下函数中删除与上面相同的代码行

handleConnectionChange = (isConnected) => {
 NetInfo.isConnected.fetch().done(
(isConnecteds) => {
  const store = createStore(reducers, {}, applyMiddleware(ReduxThunk)); //remove this line
  store.dispatch(internetConnectionChanged(isConnecteds));  
});
};