Как можно обнаружить, что следует обновить свойство предыдущего объекта?

Question

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

Я пытаюсь создать метод в Redux с использованием React, который изменяет видимость слоя.

Моя проблема в том, что изменение видимости идеально, но когда все слои не видны, и попробуйте изменить их на видимые, их свойство before не определено, кроме последнего, который изменяется.

Я собираюсь объяснитьмне лучше с примером.

mapLayers это массив, который содержит 3 слоя:

• [2] Layer3
• 1 Layer2
• [0] Layer1

CASE 1:

Если я скрываю Layer1, его свойство before не определено, и теперь я показываю Layer1 и теперь его свойство before является идентификатором Layer2.

МОЯ ПРОБЛЕМА:

• [2] Layer3
• 1 Layer2
• [0] Layer1

3 Слои не видны, поэтому:

1. Измените Layer2 на видимый -> до= undefined
2. Изменить Layer3 на видимый -> до этого = undefined
3. Изменить Layer1 на видимый -> до = id Layer2

Но при измененииLayer3 до видимого (на шаге 2), до того, как должно быть неопределено, а позже, когда видимость chage от Layer2 .. до Layer3 должна быть Layer2 id.

Важно знать, что яЯ использую response-mapbox-gl, и мне нужно свойство before для перемещения и hido / show layer.

before : string Передайте идентификатор слоя, он отобразит текущий слойперед слоем, определенным идентификатором.

https://github.com/alex3165/react-mapbox-gl/blob/master/docs/API.md

Вот мой код:

static changeLayerVisibility(layer) {
    let mapLayers = [... AxisStore.getStore().getState().map.mapGLlayers];
    const ids = mapLayers.map(l => l.id);
    const index = ids.indexOf(layer.id);
    const newVisibility = (layer.layout.visibility === 'visible') ? 'none' : 'visible';

    let nextVisibleLayer = mapLayers.find((layerObj, idx) => idx > index && layerObj.layout.visibility === 'visible');

    let updateLayout = Object.assign({}, mapLayers[index], {
        layout: Object.assign({}, mapLayers[index].layout, { visibility: newVisibility }),
        paint: Object.assign({}, mapLayers[index].paint),
        before: newVisibility === 'visible' && nextVisibleLayer ? nextVisibleLayer.id: undefined
    });

    mapLayers.splice(index, 1, updateLayout);

    return (dispatch) => {
        dispatch({
            type: MapTypeConstants.SET_MAP_LAYERS,
            payload: mapLayers
        });
    };
}

Answer 1

РЕШЕНИЕ:

Большое спасибо за вашу помощь и идеи, но я решил это следующим образом.

В Redux я создал новый метод для обновления свойства before, когда слой имеетизменить его видимость и не определено, когда должен быть идентификатор следующего слоя.

И, невозможно обновить этот слой внутри changeVisibility, потому что слой, который изменяет видимость, должен быть нарисован (визуализирован).Если не нарисовано, происходит сбой приложения, поскольку свойство before имеет идентификатор следующего слоя, а следующий слой еще не нарисован.

REDUX:

static changeLayerVisibility(layer) {

    let mapLayers = [... AxisStore.getStore().getState().map.mapGLlayers];
    const ids = mapLayers.map(l => l.id);
    const index = ids.indexOf(layer.id);
    const layoutVisibility = (layer.layout.visibility === 'visible') ? 'none' : 'visible';

    let nextVisibleLayer = mapLayers.find((layerObj, idx) => idx > index && layerObj.layout && layerObj.layout.visibility && layerObj.layout.visibility === 'visible');
    let updateLayout = Object.assign({}, mapLayers[index], {
        layout: Object.assign({}, mapLayers[index].layout, { visibility: layoutVisibility }),
        paint: Object.assign({}, mapLayers[index].paint),
        filter: (mapLayers[index].filter) ? Object.assign({}, mapLayers[index].filter) : {},
        before: layoutVisibility === 'visible' && nextVisibleLayer ? nextVisibleLayer.id: undefined,
        visible: (layoutVisibility === 'visible') ? true : false
    });
    if (this.updateLayout.type === 'raster') delete updateLayout.filter;

    mapLayers.splice(index, 1, updateLayout);

    return (dispatch) => {
        dispatch({
            type: MapTypeConstants.SET_MAP_LAYERS,
            payload: mapLayers
        });
    };
}


static updateBefore(layer) {

    let mapLayers = [... AxisStore.getStore().getState().map.mapGLlayers];
    const ids = mapLayers.map(l => l.id);
    const posInRedux = ids.indexOf(layer.id);

    let updateBeforeLayout = Object.assign({}, layer, {
        layout: Object.assign({}, layer.layout),
        paint: Object.assign({}, layer.paint),
        filter: (layer.filter) ? Object.assign({}, layer.filter) : {},
        before: (mapLayers[posInRedux + 1]) ? String(mapLayers[posInRedux + 1].id) : undefined,
        visible: layer.visible
    });
    if (this.updateBeforeLayout.type === 'raster') delete updateBeforeLayout.filter;

    mapLayers.splice(posInRedux, 1, updateBeforeLayout);

    return (dispatch) => {
        dispatch({
            type: MapTypeConstants.SET_MAP_LAYERS,
            payload: mapLayers
        });
    };
}

FRONT-END:

changeVisibility(layer) {
    this.props.changeLayerVisibility(layer);
    let layerBeforeUndefined = this.props.mapGLlayers.find(l => l.visible === true && l.before === undefined);
    if (layerBeforeUndefined) {
        setTimeout( () => {
            this.props.updateBefore(layerBeforeUndefined);
        });
    }
};

Теперь я хочу сократить код впереди, потому что вся логика должна быть одной избыточностью и должна выглядеть так:

changeVisibility(layer) {
    let userMapboxLayers = this.props.map.getStyle().layers.filter(l => l.source && l.source.indexOf('sourceId_') !== -1);
    this.props.changeLayerVisibility(userMapboxLayers, layer);
};

Answer 2

На самом деле, я думаю, что есть лучшие способы установить ваши свойства.

---

Во-первых, используйте массив для хранения свойств видимости. Как ниже, начальное значение должно быть ложным.

interface InVisiablityProps {
   visible: Array<Boolean>
}

const initialState:InVisiablityProps = {
   invisible: [false,false,false]
}

При каждом изменении представления на invisible. меняйте свойство на! (Свойство)