ReferenceError: ReferenceError: Не удается найти переменную: dispatch - PullRequest
1 голос
/ 20 марта 2019

Я пытаюсь использовать излишний с реактивно-родным. Я создал приложение с примером извлечения данных поста, а затем я просто хотел использовать метод mapDispatchToProps. Я прочитал документацию и посмотрел какой-то учебник, он выглядит примерно так.

Проблема в том, что когда я пытаюсь использовать mapDispatchToProps, возвращается ошибка:

ReferenceError: ReferenceError: Не удается найти переменную: отправка

В HomeScreen появляется ошибка

Мой домашний экран

import React from 'react';
import { View } from 'react-native';
import { connect } from 'react-redux';
import { getPosts } from '../actions/index';

class HomeScreen extends React.Component {

  state = {
    data:[],
  }

  componentDidMount() {
    this.props.getPosts()
}

  render() {
    return (
      <View style={styles.container}>

      </View>
    );
  }
}


function mapStateToProps  (state)   {
  return {
    posts: state.posts
  };
};

function mapDispatchToProps (dispatch)   {
  return {
    getPosts: () => {
      dispatch(getPosts())
    }
  };
};


export default connect(mapStateToProps, mapDispatchToProps)(HomeScreen)

Мой магазин

import { createStore } from 'redux';
import rootReducer from '../reducers';

export default store = createStore(rootReducer);

Мое действие

import { GET_PGET_POST_LOADING,GET_POST_RECEIVED,GET_POST_ERROR } from './actionTypes';
import { GET_POST_URL } from '../api';

export const getPosts = () => {
    dispatch({
        type: GET_POST_LOADING
    });
    fetch(GET_POST_URL).then((data) => {
        console.log(data);
        dispatch({
            type:GET_POST_RECEIVED,
            payload:data
        })
    }).catch((error) => {
        console.log(error)
    })
}

Мой редуктор

import { GET_POST_LOADING, GET_POST_RECEIVED, GET_POST_ERROR } from '../actions/actionTypes';

const Post = (state = { posts: [] , loading: true }, action) => {
    console.log(action);
    switch(action.type) {
        case GET_POST_LOADING:
            return { 
                ...state,
                loading: true 
            }
        case GET_POST_RECEIVED:
            return {
                loading:false,
                posts: action.payload
            }
        case GET_POST_ERROR:
            return state;
    default:  return state;
    }
}

export default Post;

Мои приложения

import React from 'react';
import { Platform, StatusBar, StyleSheet, View } from 'react-native';
import { AppLoading, Asset, Font, Icon } from 'expo';
import AppNavigator from './navigation/AppNavigator';

import { Provider } from 'react-redux';
import store from './store/index';

export default class App extends React.Component {
  state = {
    isLoadingComplete: false,
  };

  render() {
      return (
        <Provider store={store}>
         <View style={styles.container}>
          {Platform.OS === 'ios' && <StatusBar barStyle="default" />}
          <AppNavigator />
        </View>
        </Provider>

      );
  }
}

Я новичок в Redux, где мне не хватает?

Заранее спасибо:)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...