1
votes

La fonction n'est pas définie store.getState ()

J'ai des problèmes avec la boutique de React Native. J'ai configuré le magasin dans mon magasin de fichiers / index.js. Je l'ai exporté puis importé dans App.js. Les actions du réducteur sont exécutées correctement, le logger affiche les actions dans le débogueur du navigateur, mais il y a un problème "la fonction n'est pas définie store.getState (). Quand je tape dans la console du navigateur" store.getState () "j'obtiens un problème" store n'est pas défini ". Je n'ai aucune idée de ce qui pourrait ne pas être le cas: / Merci pour l'aide!

mon fichier store / index.js:

  "dependencies": {
    "axios": "^0.18.0",
    "intl": "^1.2.5",
    "react": "16.8.3",
    "react-intl": "^2.7.2",
    "react-native": "0.59.5",
    "react-native-gesture-handler": "^1.2.1",
    "react-navigation": "^3.11.0",
    "react-navigation-redux-helpers": "^3.0.2",
    "react-redux": "^5.0.7",
    "redux": "^4.0.0",
    "redux-axios-middleware": "^4.0.0",
    "redux-devtools-extension": "^2.13.8",
    "redux-logger": "^3.0.6",
    "redux-observable": "^1.1.0",
    "rxjs": "^6.0.0-beta.0"
  },

mon fichier App. js:

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View} from 'react-native';
import { createStackNavigator, createAppContainer } from "react-navigation";
import { default as NavigationComponent } from './navigation';
import store from "./store/index.js";
import { IntlProvider, addLocaleData} from "react-intl";
import messages_pl from "./formattedMessages/pl.json";
import locale_pl from 'react-intl/locale-data/pl';

import { connect, Provider } from "react-redux";

addLocaleData([...locale_pl]);

global.Intl = require('intl');

const messages = {
    'pl': messages_pl,
};

const initialState = {};

export default class App extends Component<Props> {

  render() {
    return (
      <Provider store={store}>
        <IntlProvider locale="pl" messages={messages["pl"]} textComponent={Text}>
          <NavigationComponent  />
        </IntlProvider>
      </Provider>

    );
  }
}

et dépendances:

import { createStore, combineReducers, applyMiddleware, compose } from 'redux';
import { default as mailReducer } from './Mail';
import { default as authReducer } from './Auth';
import { navReducer } from './Navigation';
import { logger } from 'redux-logger';
import { composeWithDevTools } from 'redux-devtools-extension';
import { combineEpics, createEpicMiddleware } from 'redux-observable';
import { middleware as navMiddleware } from "../navigation";

const rootReducer = combineReducers({
    points: mailReducer,
    auth: authReducer,
});



const initialState = {};

const store = createStore(
  rootReducer,
  applyMiddleware(logger)
);

export default store;

javascript reactjs react-native react-redux redux

8 commentaires

lorsque vous tapez dans la console du navigateur? avez-vous mis store sur la fenêtre ?

Je voulais dire dans la console de débogage native react :) Qu'entendez-vous par «fenêtre»? :)

pouvez-vous fournir une capture d'écran de votre saisie dans la fenêtre et d'obtenir une erreur? Je suppose que vous essayez d'accéder au magasin via window.store.getState () car c'est la console du navigateur et window est l'objet global. sinon le magasin auquel vous essayez d'accéder n'est pas dans la même fermeture

mon point principal est que rien dans votre code ne met store sur quelque chose auquel vous pouvez accéder à l'intérieur de la console à moins que vous ne soyez arrêté sur le point d'arrêt lorsque le module est chargé peut-être

@azium Merci pour votre réponse! :) Ici vous pouvez trouver une capture d'écran avec mes problèmes: imgur.com/bRpCyFN

tapez window.store = store quelque part dans votre code après l'avoir déclaré. voir si cela le résout

Malheureusement, cela n'a pas fonctionné: / La même erreur: /

Pourquoi voulez-vous quand même accéder au magasin à partir de la console?

3 Réponses :

0
votes

Vous devez installer https://github.com/jhen0409/react-native-debugger < / a> il inclut des outils pour inspecter le magasin. C'est beaucoup plus utile que le débogueur de navigateur par défaut.

0 commentaires

1
votes

En supposant que votre boutique est correctement configurée, car vous voyez les actions appropriées déclenchées, à partir de vos composants, et ces actions sont gérées de manière appropriée par les réducteurs. Je soupçonne que le problème vient de la configuration de la redux-devtools-extension qui permet d'inspecter le magasin redux depuis leur navigateur. Vous pouvez peut-être essayer les étapes suivantes et voir si cela résout votre problème:

Installez l'extension Redux Dev Tool pour votre navigateur approprié:

Chrome

Firefox
Ajoutez votre magasin redux à l'objet global window

Par exemple, un simple fichier store.js peut ressembler à ceci:

store.js: p >

window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()

Notez cette ligne:

import { createStore, applyMiddleware, compose } from 'redux';
import thunk from 'redux-thunk';
import rootReducer from './reducers';

const initialState = {};

const middleware = [thunk];

const store = createStore(
  rootReducer,
  initialState,
  compose(
    applyMiddleware(...middleware),
    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
  )
);

export default store;

qui vous permettra d'accéder au magasin depuis la fenêtre de la console de votre navigateur. Nous utilisons la fonction compose de redux pour appliquer le middleware nécessaire à notre boutique.

Pour plus d'informations, consultez le redux-devtools-extension officiel documentation ainsi que cette tutoriel

J'espère que cela aide!

0 commentaires

0
votes

Si vous utilisez 'redux-persists' et que vous renvoyez {store, persistor} depuis ../store, essayez simplement ceci:

import returnStoreAndPersistor from "../../store";

const { store } = returnStoreAndPersistor()

console.log(store.getState())

0 commentaires