Получение ошибки movieValues ​​и movieProfile не определены при вызове действия из компонента - PullRequest
2 голосов
/ 28 апреля 2020

Я создал компонент Dashboard. js, из которого я вызываю экшн movievalues, который будет возвращать массив 5 mov ie в массиве movieprofiles. Но когда я вызываю action и movieProfiles в компоненте Dashboard, он возвращает неопределенное значение. Я ожидаю, чтобы вернуть массив, который имеет данные пять mov ie.

error image

enter image description here

Combine Reducer file index.js

import{ combineReducers} from 'redux';
 import moviedata from './moviedata';
 import expenses from './moviedata';


export default  combineReducers({
 moviedata,
 expenses
}); 

Reducer movidata

 import {MOVIEDATA,MOVIEDATA_ERROR, ACTIONTEST} from '../action/type';
    const initialState={
        movieProfiles:[],
        error:{},
        testvalue:null,
        loading:true

    }
    export default function (state= initialState,action){
    const {type,payload}=action;
    switch(type){
     case MOVIEDATA:   
        console.log('working');
        return{
           ...state,
           movieProfiles:payload,
           loading:false
        }
        case MOVIEDATA_ERROR:
            return {
                ...state,
                error:payload,
                loading:false

            };

        default:
            return state;

    }
    }

Action Moviedata.js

import {MOVIEDATA,MOVIEDATA_ERROR,ACTIONTEST} from './type';
import axios from 'axios';
//Load User

export const movieValues =() => async dispatch =>{
    console.log("action");
    const value={
        id:1,
        count:5
    }
    const config={
    headers:{
        'Content-Type':'application/json'
    }
}
    try{

        const res=await axios.get('https://movieapi-info.herokuapp.com/',value,config);
        console.log(res.data.data);

        dispatch({
            type: MOVIEDATA,
            payload:res.data.data
        });

    }
    catch(err)
    {
         dispatch({
             type:MOVIEDATA_ERROR
         })
    }
} 

Component dashboard.js where i am calling action movieValues

import React,{Fragment} from 'react';
import PropTypes from 'prop-types';
import {movieValues} from '../../action/moviedata'
import {connect} from 'react-redux';

export const Dashboard=({movieValues,movieProfiles})=>{

console.log(movieProfiles);
const getData = e =>{
  e.preventDefault();
  const val= movieValues();
  console.log(val);
}

return(
    <div>
    <button onClick={getData}>Get Data</button>
    </div>
)

}
Dashboard.propTypes = {
    movieValues: PropTypes.func.isRequired,
    movieProfiles:PropTypes.object.isRequired
  };

  const mapStateToProps =state=>({
    movieProfiles:state.moviedata.movieProfiles

})


  export default connect(
    mapStateToProps,
    {movieValues}
  )(Dashboard);  
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...