0

Есть экшн для получения задач, который принимает параметр (статус: в работе или нет) При подключении его в компоненте + подключении его в дочернем компоненте, поулчается бесконечный рендеринг. В родительском компоненте получаются активные задачи, в дочернем завершенные.

Вызываю в didMount

this.props.getTasks(false,this.props.client_name,'Завершена') - Родитель
this.props.getTasks(false,this.props.client_name,'В работе') - Дочерний

Map State To Props и вызов коннекта

    function mapStateToProps(store) {
        return {
            clients:store.clients.clients,
            complete_tasks:store.tasks.tasks,
            is_loading:store.clients.is_loading
        }
    }

export default connect(mapStateToProps,{getClient,getTasks})(ClientCard)

Если оставить проверку только на clients.is_loading то данные родительского компонента перетираются данными дочернего. Если ставить проверку на загрузку задач + клиентов то бесконечный рендеринг

is_loading:store.clients.is_loading || store.tasks.is_loading ? true : false

Кажется, что проблема в изменении данных. Думаю, что происходит рендер каждый раз когда данные загружаются независимо дочерний компонент или родительский. если при рендере кинуть console.log(tasks.is_loading ) ,то будет true,false,true,false... и так бесконечно.

Мб их нужно получать все и выводить с .filter? Но костыльно получается, как по мне.

Action вот:

import {GET_TASKS} from "../constants/taskConstants";
import axios from 'axios'

//Получение активных задач
export function getTasks(date=false,client=false,status=false) {
    let params = '?'

    params +=
        date
        ? 'date=' + date + '&'
        : ''

    params +=
        client
        ? 'client_name=' + client + '&'
        : ''

    params +=
        status
        ? 'status=' + status + '&'
        : ''


    return {
        type: GET_TASKS,
        payload: axios.get('http://localhost/tasks'+params),
    }
}
2
  • было бы хорошо увидеть код компонент 3 апр 2019 в 6:46
  • Эм... осмелюсь дать пару советов. Если параметров много, то можно передавать объект, это будет удобнее.Что-то мне подсказывает, что экшн должен быть простым и код с логикой нужно поместить в редьюсер, а еще не возвращать промис, ведь axios.get вернет Promise. Видится мне в этом коде плохо спроектированная архитектура приложения - отсюда и сайд эффекты. 3 апр 2019 в 7:00

1 ответ 1

0

Denis Bubnov прав, структура не верная. Переделал логику, все заработало нормально.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.