Гость
Целевая тема:
Создать новую тему:
Автор:
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / React Redux Объясните Поведение / 12 сообщений из 12, страница 1 из 1
02.04.2018, 09:37
    #39624021
irbis_al
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
Добрый день...
Кто более или менее знаком с redux,может мне объяснить почему такое поведение..
Еть Footer итого...который пересчитывает заказ при изменении суммы и количества.
см видео.
https://cloud.mail.ru/public/NBUq/3QKFaV5Hb
Но если я комментирую код,который избыточен
Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
const mapStateToProps = (state) => {
    //console.log('footer=',state.Contents.orders);
    return {
        orders:state.Contents.orders,
/*
        is_select:state.Contents.orders.filter((row)=>{
            return (row.is_select===1)
        })
*/


    };
};


1.Причем is_select вообще не используется
2.is_select является производной(просто filter причем условие может быть любое типа row.is_select===ысысыцс)
от необходимого state.Contents.orders,

Непонятно поведение в console.log('footer=',state.Contents.orders); видно что Contents.orders приходит правильный.(дальше в коде просто подбивается сумма).
Но без
Код: javascript
1.
2.
3.
  is_select:state.Contents.orders.filter((row)=>{
            return (row.is_select===1)
        })


Не перерисовывается.
...
Рейтинг: 0 / 0
02.04.2018, 10:45
    #39624054
skyANA
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
irbis_al,

сложно что-то сказать по огрызку кода и не внятным объяснениям
...
Рейтинг: 0 / 0
02.04.2018, 10:49
    #39624058
irbis_al
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
skyANAirbis_al,

сложно что-то сказать по огрызку кода и не внятным объяснениям

Ну вот код TotalOrder..Там всё просто обычный Component обвёрнутый в connect
Поэтому его код и не давал.

Код: javascript
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
/**
 * Created by shop on 30.03.18.
 */
import React, { Component } from 'react';
import './styles.css';
import { connect } from 'react-redux';
import {format1} from '../../Common/utils';
import {get_sum_row} from '../../Common/utils';

class  TotalOrder extends React.Component {
    constructor(props) {
        super(props);
        this.get_sumorder=this.get_sumorder.bind(this);

    }


    get_sumorder(orderarray){
//let orderarray=this.props.orders;
        let sum=0.0;
        var l = orderarray.length;
        for (var i = 0; i < l; i++) {
            sum=sum+get_sum_row(orderarray[i]);

        }


        return format1(sum,"");
    }
    render() {
let sum=this.get_sumorder(this.props.orders);
//console.log(sum);
        return (
            <div className="summary clearfix">
                <div className="line">
                    <div className="entry total">
                        <span className="labeltotal">
                            Итого: </span> <span className="value">{sum}</span>

                    </div>
                </div>
            </div>
        );
    }

}

const mapStateToProps = (state) => {
    //console.log('footer=',state.Contents.orders);
    return {
        orders:state.Contents.orders,

        is_select:state.Contents.orders.filter((row)=>{
            return (row.is_select===1)
        })


    };
};

const mapDispatchToProps = (dispatch) => {
    return {

    };
};
//export connect(mapStateToProps, mapDispatchToProps)(OrderLines);
export default connect(mapStateToProps, mapDispatchToProps)(TotalOrder);



...
Рейтинг: 0 / 0
02.04.2018, 23:11
    #39624380
stanilar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
Наверно потому, что state.Contents.orders - неизменный массив объектов, а state.Contents.orders.filter - функция от внутреннего состоянию объектов.

З.Ы. Какая удивительная тенденция, делать видео вместо обдуманного описания процесса.
...
Рейтинг: 0 / 0
03.04.2018, 08:10
    #39624455
irbis_al
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
stanilarНаверно потому, что state.Contents.orders - неизменный массив объектов, а state.Contents.orders.filter - функция от внутреннего состоянию объектов.

З.Ы. Какая удивительная тенденция, делать видео вместо обдуманного описания процесса.

Ну про видео лучше один раз увидеть...это время экономит всем.
А state.Contents.orders изменяется в console log приходит order в котором уже новое поле количество и цена.
В отличие от is_select который всегда []
Я так понимаю раз он подписан на orders то и должен слушаться.
...
Рейтинг: 0 / 0
03.04.2018, 17:32
    #39625112
stanilar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
irbis_alЯ так понимаю раз он подписан на orders то и должен слушаться.

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

Слушается изменение. Если state.Contents.orders - неизменный массив то рендера не будет, хоть какие поля в объектах меняй. Результат state.Contents.orders.filter - изменяется каждый раз, как меняется что-то внутри объектов массива, а заодно и вызывается рендер.

Видео я три раза просмотрел пока не понял на что обратить внимание. Не говоря уже о сути вопроса. Если бы сам не интересовался реактом, даже бы второй раз просматривать не стал. Видео это конечно круто, но прочесть хорошо сформулированный вопрос - это меньше минуты и один раз.
...
Рейтинг: 0 / 0
03.04.2018, 17:35
    #39625116
stanilar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
irbis_alв console log приходит order в котором уже новое поле количество и цена.

Это ты про ту консоль говоришь, которая в mapStateToProps? Ну и как эта консоль относится к рендеру компонента?
...
Рейтинг: 0 / 0
03.04.2018, 19:53
    #39625213
irbis_al
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
stanilarirbis_alв console log приходит order в котором уже новое поле количество и цена.

Это ты про ту консоль говоришь, которая в mapStateToProps? Ну и как эта консоль относится к рендеру компонента?

Напрямки никак...Но в консоле я вижу ,что изменился один из элемент массива Contents.orders..
Следовательно должен быть рендеринг...я от redux именно этого и ожидаю.
А я ожидаю ,-Меняется состояние и он(redux) толкает рендеринг.
is_select вообще не меняется ,но с ним рендеринг толкается...
Вот я и хочу чтоб мне объяснили поведение
...
Рейтинг: 0 / 0
03.04.2018, 20:23
    #39625223
irbis_al
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
Вот тут немного мутновато но объясняется
https://stackoverflow.com/questions/39513753/my-redux-state-has-changed-why-doesnt-react-trigger-a-re-render
...
Рейтинг: 0 / 0
03.04.2018, 21:11
    #39625236
stanilar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
irbis_alis_select вообще не меняется ,но с ним рендеринг толкается...

Да как не меняется, если filter всегда новый массив возвращает!
...
Рейтинг: 0 / 0
03.04.2018, 21:35
    #39625245
irbis_al
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
stanilarirbis_alis_select вообще не меняется ,но с ним рендеринг толкается...

Да как не меняется, если filter всегда новый массив возвращает!

Ну в принципе в той статье так и объясняется...
Что map filter reduce форсированно меняет.
Для redux всё равно
Код: javascript
1.
2.
Contents.orders :array[{...}{...}{...}{...}] и Contents.orders :array[{...}{...}{...}{...чуть другое}]...А вот если количество items поменялось бы
Contents.orders :array[{...}{...}](стало 2 против 4) тогда бы сработало.


Надо будет поэкспериментировать.
...
Рейтинг: 0 / 0
03.04.2018, 22:15
    #39625254
stanilar
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
React Redux Объясните Поведение
irbis_al
Код: javascript
1.
...чуть другое



Два разных объекта не могут быть чуть-чуть другими, даже если у них одинаковое внутреннее содержание. Это принципиально два разных объекта.

А вот массив из двух объектов это один и тот-же массив, как бы ты не менял содержимое его объектов.
...
Рейтинг: 0 / 0
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / React Redux Объясните Поведение / 12 сообщений из 12, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали форум (0):
Пользователи онлайн (0):
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]