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 прав, структура не верная. Переделал логику, все заработало нормально.

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

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