'redux-persist' TypeError: undefined is not a function (near '...store.dispatch...')

时间:2021-06-23 14:58:05

标签: react-native redux-persist

我实际上正在尝试为 react-native 应用程序设置 redux-persist 存储,但我总是收到此错误:“TypeError: undefined is not a function (near '...store.dispatch...' )”。我尝试了不同的教程,但没有一个有效,我不明白它来自哪里。

这是我的 ConfigureStore.js :

import { createStore } from 'redux'


import addBalise from './Reducers/addBalise'
import { persistStore, persistReducer } from 'redux-persist'
import AsyncStorage from '@react-native-community/async-storage';


const rootPersistConfig = {
  key: 'root',
  storage: AsyncStorage,
}

const persistedReducer = persistReducer(rootPersistConfig,addBalise)


export default () => {
  let store = createStore(persistedReducer)
  let persistor = persistStore(store)
  return { store, persistor }
}

我的减速器 addBalise.js(我知道它很乱很抱歉...):

import firebase from 'firebase'


const initialState = {
  BaliseSeen: {},
  Medailles: [],
  User: []
}

var firebaseConfig = {
  apiKey: "**********",
  authDomain: "************",
  databaseURL: "**************",
  projectId: "*******",
  storageBucket: "*********",
  messagingSenderId: "********",
  appId: "**********",
  measurementId: "********"
};

async function ajoutmedaille() {



}


function addBalise(state = initialState, action) {
  let nextState
  switch (action.type) {
    case 'ADD_BALISE':
      var city = action.value.ville
      console.log(city)

      var BaliseSeenIndex = -1;
      console.log()
      if (state.BaliseSeen[city] != undefined /* && state.BaliseSeen[city]  */) {
        BaliseSeenIndex = state.BaliseSeen[city].findIndex(item => item.id === action.value.id)
        console.log(state.BaliseSeen[city].findIndex(item => item.vue === false) != -1)
      } else {
        state.BaliseSeen[city] = []

        BaliseSeenIndex = -1;
      }
      if (BaliseSeenIndex == -1) {

        console.log('Balise ajoutée')
        nextState = {
          ...state,
          BaliseSeen: {
            ...state.BaliseSeen, [city]: [...state.BaliseSeen[city], { id: action.value.id, type: action.value.type, nom: action.value.nom, vue: action.value.vue }]
          }
        }
      }
      else if (state.BaliseSeen[city].findIndex(item => item.vue === false) != -1) {
        return {
          ...state,
          BaliseSeen: {
            ...state.BaliseSeen,
            [city]: state.BaliseSeen[city].map((item) =>
              item.id !== action.value.id
                ? item//not the item we want to edit, return unchanged
                : {//item we are looking for, return changed copy
                  ...item,
                  vue: true,
                }
            ),
          },
        };
      }
      else if (action.value.vue) {
        nextState = {
          ...state,
          BaliseSeen: {
            ...state.BaliseSeen
          }
        }


      }
      if (action.value.vue)
        return addBalise(nextState, { type: "ADD_MEDAILLE", value: { ville: action.value.ville } })
      else
        return nextState || state


    case 'ADD_MEDAILLE':
      console.log('ADD_MEDAILLE')
      var rappel = false;

      nextState = {
        ...state
      }
      return action.value.rappel === true ? addBalise(nextState, { type: "NEW_MEDAILLE", value: { ville: action.value.ville } }) : nextState || state

    case "NEW_MEDAILLE":


      nextState = {
        ...state,
        Medailles: [...state.Medailles, { ville: action.value.ville }]
      }


      return nextState || state

    case 'ADD_USER':
      var nom = action.value.nom
      var mdp = action.value.mdp
      console.log("add user -----------")
      console.log(nom)
      console.log(mdp)

      nextState = {
        ...state,
        User: [nom, mdp]
      }

      return nextState || state

    default:
      return state
  }
}


export default addBalise

我的 App.js :

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { Provider } from 'react-redux';
import Navigation from './Navigation/Navigation';
import Store from './Store/configureStore';
import { persistStore } from 'redux-persist';
import { PersistGate } from 'redux-persist/integration/react'


export default class App extends React.Component {

  render() {
    let persistor=persistStore(Store)
    return (
      
      <Provider store={Store}>
        <PersistGate loading={null} persistor={persistor}>
          <Navigation />
        </PersistGate>
      </Provider>
    )
  }
}

这是我的 node.js cmd 的完整屏幕截图: complete error screenshot

感谢您抽出时间帮助我!

0 个答案:

没有答案