虽然配置 react-native-offline get undefined 不是一个对象 'state.network.isConnected，同时将其与 redux-persist 和 red

Question

当前行为

-尝试使用react native offline redux thunk redux persistent创建一个工作解决方案-运行应用程序时获取undefined is not an object (evaluating 'state.network.isConnected')。app.js

import React from "react";
import { Provider } from "react-redux";
import configureStore from "@store/configure-store.js";
import { PersistGate } from "redux-persist/es/integration/react";
import { ReduxNetworkProvider } from 'react-native-offline';
import Router from "@appComponents/router.js";
const { persistor, store } = configureStore;
export default App = props => (
<Provider store={store}>
<PersistGate persistor={persistor}>
<ReduxNetworkProvider>
<Router />
</ReduxNetworkProvider>
</PersistGate>
</Provider>
);

app.js

import { createStore, applyMiddleware } from "redux";
import { persistStore, persistReducer } from "redux-persist";
import AsyncStorage from "@react-native-async-storage/async-storage";
import ReduxThunk from "redux-thunk";
import ReduxLogger from "redux-logger";
import hardSet from "redux-persist/lib/stateReconciler/hardSet";
import rootReducer from "@store/store";
import { createNetworkMiddleware } from "react-native-offline";
import { createTransform } from 'redux-persist';

import { user } from "@constants/action-types";
const { loginSuccess } = user;
const networkTransform = createTransform(
(inboundState, key) => {
const actionQueue = [];
inboundState.actionQueue.forEach(action => {
if (typeof action === 'function') {
actionQueue.push({
function: action.meta.name,
args: action.meta.args,
});
} else if (typeof action === 'object') {
actionQueue.push(action);
}
});
return {
...inboundState,
actionQueue,
};
},
(outboundState, key) => {
const actionQueue = [];
outboundState.actionQueue.forEach(action => {
if (action.function) {
const actionFunction = actions[action.function];
actionQueue.push(actionFunction(...action.args));
} else {
actionQueue.push(action);
}
});
return { ...outboundState, actionQueue };
},
{ whitelist: ['network'] },
);
const persistConfig = {
key: 'root',
storage: AsyncStorage,
stateReconciler: hardSet,
whitelist: ["app", "user"],
transforms: [networkTransform],
};

const networkMiddleware = createNetworkMiddleware({
regexActionType: /^OTHER/,
actionTypes: [loginSuccess],
queueReleaseThrottle: 200
});
const persistedReducer = persistReducer(persistConfig, rootReducer);
const isDevMode = Boolean(__DEV__);
const middleWares = isDevMode ? [networkMiddleware, ReduxThunk, ReduxLogger] : [networkMiddleware, ReduxThunk];
const store = createStore(persistedReducer, {}, applyMiddleware(...middleWares));
const persistor = persistStore(store);
export default { store, persistor };

pakage.json

"dependencies": {
"@react-native-async-storage/async-storage": "^1.15.5",
"@react-native-community/masked-view": "^0.1.11",
"@react-native-community/netinfo": "^5.9.10",
"@react-navigation/native": "^5.9.4",
"@react-navigation/stack": "^5.14.5",
"axios": "^0.21.1",
"react": "17.0.1",
"react-native": "0.64.2",
"react-native-gesture-handler": "^1.10.3",
"react-native-offline": "^5.8.0",
"react-native-reanimated": "^2.2.0",
"react-native-safe-area-context": "^3.2.0",
"react-native-screens": "^3.3.0",
"react-redux": "^7.2.4",
"redux": "^4.1.0",
"redux-persist": "^6.0.0",
"redux-thunk": "^2.3.0"
}

action.js

const UserActions = {
loginTap: tapped => {
function thunk(dispatch, getState) {
const user = { email: '[e-mail]', password: 'Rohtash*1' };
dispatch({ type: loginStart })
if (!tapped) {
axios.post(userLogin, user).then(function (response) {
console.log("response", response.data);
dispatch({ type: loginSuccess, payload: tapped })

}).catch(function (error) {
dispatch({ type: loginFailure, payload: error })
})
}
else {
dispatch({ type: loginTapped, payload: tapped })
}

}
thunk.interceptInOffline = true;
return thunk;
}
};

预期行为

• 使其与redux peersist一起工作，并在以后将工作解决方案合并到Release构建中

如何繁殖

• 在配置了所有软件包和以下链接后，无法启动应用程序

环境

版本

软件
本地离线反应	"5.8.0">
react native	"0.64.2〃
节点	v15.9.0
npm或纱线	npm 7.5.3

state.network.isConnected存在于您的redux存储中

你所需要做的就是创建一个getter函数，它将返回它的值

你可以参考这个例子来了解如何做到这一点