Блог

Я пытаюсь показать данные из объекта в запросе POST, но когда я пытаюсь показать данные в моем компоненте, я получаю эту ошибку:

‘Ошибка типа: patito не определено’

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

ConfigStore.js

 import { ReduceStore } from 'flux/utils';
import ActionTypes from '../constants/AppConstants';
import AppDispatcher from '../dispatcher/AppDispatcher';
import config from '../../config';


class ConfigStore extends ReduceStore {

    getInitialState() {
        return {
            language: config.SiteConfig.defaultLanguage,
            languageLabels: {},
            races: [],
            tracks:{}
        };
    }

    reduce(state, action) {

        switch (action.type) {
            case ActionTypes.GET_TRACK:
                var newState = Object.assign({}, state);
                newState.tracks = action.data;
                return newState;
            case ActionTypes.GET_RACE:
                var newState = Object.assign({}, state);
                newState.races = action.data;
                return newState;
            default:
                return state;
        }
    }
}

export default new ConfigStore(AppDispatcher);
  

trackUtils.js

 import AppDispatcher from '../dispatcher/AppDispatcher';
import ActionTypes from '../constants/AppConstants';
import ConfigStore from '../stores/ConfigStore';
import config from '../../config';
import axios from 'axios';

class trackUtil {

    constructor() {
        this.serverConfig = config.ServiceConfig;
        this.baseURL = this.serverConfig.url   ':'   this.serverConfig.port   '/';
        this.appConfig = config.AppConfig;
    }

    trackRequest(data) {
        const url = this.baseURL   'BusRace/GetActiveTracksDate';

        const requestJSON = {
            DGSReq: {
                InParams: {
                    LogonSessionID: 17629,
                    ProfileID: 1,
                    RaceDate: "03/20/2019",
                    UIType: 1
                }
            }
        };

        axios.post(url, requestJSON)
            .then((response ) =>  {
                AppDispatcher.dispatch({
                    type: ActionTypes.GET_TRACK,
                    data: {...response.data.DGSResp}
                });
                console.log(response.data.DGSResp);
            })
            .catch((error) => {
                console.log(error);
            });
    };

}

export default new trackUtil();
  

trackjs (компонент)

 import React, { Component } from 'react';
import { Container } from 'flux/utils';
import ConfigStore from '../stores/ConfigStore';
import ActionTypes from '../constants/AppConstants';
import ActionCreators from "../actions/ActionCreators";
import { Redirect } from 'react-router-dom';

class Body extends Component {

    static getStores() {
        return [ConfigStore];
    };

    static calculateState() {
        let configData = ConfigStore.getState();
        return {
            configInfo: configData
        };
    };

    componentDidMount() {
        const params = {...this.state, ...{actionType: ActionTypes.GET_TRACK}};
        ActionCreators.actionTrigger(params);
    }

    render() {

        const patito= this.state.configInfo.tracks.TrackList;
        console.log(patito);
        let i = 0;
        for(i; i<patito.List.length; i  ) {
            return(
                <div className="post card" key={patito.track-name}>

                </div>
            );
        }

        }
}


export default Container.create(Body);
  

Надеюсь, кто-нибудь сможет мне помочь, у меня около 2 дней с этой ошибкой.

где вы определили состояние вашего компонента? Я не нашел подсказки о состоянии в вашем компоненте. Кроме того, объект configStore, к которому вы пытаетесь получить доступ через this.state , будет недоступен до тех пор, пока вы не обновите свое состояние с помощью setState или инициализации state. Кроме того, я предложу использовать перехват жизненного цикла react componentWillReceiveProps для обновления состояния вашего компонента. это может вам помочь.

 class Body extends Component {
    constructor() {
      this.state={
        configInfo: {}
      }
    }
    static getStores() {
        return [ConfigStore];
    };

    static calculateState() {
        let configData = ConfigStore.getState();
        this.setState({configInfo: configData});
        return {
            configInfo: configData
        };
    };

    componentDidMount() {
        const params = {...this.state, ...{actionType: ActionTypes.GET_TRACK}};
        ActionCreators.actionTrigger(params);
    }

    render() {

        const patito= this.state.configInfo.tracks.TrackList;
        console.log(patito);
        let i = 0;
        for(i; i<patito.List.length; i  ) {
            return(
                <div className="post card" key={patito.track-name}>

                </div>
            );
        }

        }
}