несколько раз реагировать на вызов избыточной страницы в хранилище больших данных - PullRequest
0 голосов
/ 29 марта 2019

Я использую material-ui react-redux.store данные каждый раз, когда все данные.Использование небольших данных работает нормально, но при использовании больших данных я наблюдаю множественные вызовы компонентов.

import React from 'react';
import { Switch, Route } from 'react-router-dom';
import PropTypes from "prop-types";
import { bindActionCreators } from "redux";
import { connect } from "react-redux";
import axios from "axios";
import {
    vehiclefetchAction,
    vehiclefetchInactiveAction,
} from "dan-actions/VehicleActions";
import { playTransitionAction } from 'dan-actions/UiActions';
import {
    Vehicle,
    AddVehicle,
    EditVehicle,
    ViewVehicle
} from '../pageListAsync';
import Parent from './Parent';
import GlobalVariable from "../../path/global";

const branch = "VehicleDemo";
const baseApiUrl = GlobalVariable.BASE_API_URL;

class VendorPage extends React.Component {

    componentDidMount() {
        this.handledata();
    }

    handledata() {
        this.props.loadTransition(false);
        const userDetails = JSON.parse(localStorage.getItem("userDetails"));
        axios
            .get(baseApiUrl + "v1/vehicles", {
                headers: { Authorization: userDetails.token }
            })
            .then(response => {
                var activeData = response.data.activeData;
                var inactiveData = response.data.inactiveData;
                if (activeData !== undefined) {
                    this.props.fetchData(activeData, branch);
                    // console.log(activeData)
                }
                if (inactiveData !== undefined) {
                    this.props.fetchInactiveData(inactiveData, branch);
                }
                this.props.loadTransition(true);
            })
    }

    render() {
        return (
            <Parent>
                <Switch>
                    <Route exact path="/app/settings/vehicles" component={Vehicle} />

                </Switch>
            </Parent>
        );
    }
}
VendorPage.propTypes = {
    fetchData: PropTypes.func.isRequired,
    fetchInactiveData: PropTypes.func.isRequired,
    loadTransition: PropTypes.func.isRequired,
};
const mapDispatchToProps = dispatch => ({
    fetchData: bindActionCreators(vehiclefetchAction, dispatch),
    fetchInactiveData: bindActionCreators(vehiclefetchInactiveAction, dispatch),
    loadTransition: bindActionCreators(playTransitionAction, dispatch),
});

const CrudTbFormDemoMapped = connect(
    mapStateToProps,
    mapDispatchToProps
)(VendorPage);

export default CrudTbFormDemoMapped;

Это мой компонентный код, который вызывается несколько раз.Почему это происходит.

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

...