состояние по умолчанию изменяется внутри редуктора без каких-либо воздействий на него - PullRequest
0 голосов
/ 30 октября 2018

В одном из моих файлов редуктора я изначально установил свое состояние по умолчанию так:

export let defaultState = {
    devices: {},
    canBeDeleted: false,
    willBeDeleted: null,

};

Когда я проверил состояние внутри своей функции mapStateToProps, я заметил, что состояние теперь выглядит так:

device:
       canBeDeleted: true
devices: {XXXXXXXXXX: {…}, XXXXXXXXX: {…}}
willBeDeleted: null

Когда я добавляю дополнительные параметры к устройству, они появляются. Однако когда я их удаляю, они остаются. Что вызывает изменение состояния по умолчанию canBeDeleted с false на true? Кроме того, что является причиной того, что дополнительные параметры остаются даже после того, как я удалил из своего кода?

mapStateToProps выглядит так

const mapStateToProps = (state) => {
    console.log('mapStateToProps: state', state);
    return {
        devices: state.device.devices,
        canBeDeleted: state.device.canBeDeleted
    }
}

редактирование:

вот каталог конфигурации:

export default function configureStore(preloadedState) {
    console.log('inside ConfigureStore: preloadedState: ', preloadedState);
    // DEBUG
    if (__DEV__) {
        return createStore(
            rootReducer,
            preloadedState,
            applyMiddleware(
                thunkMiddleware,
                // loggerMiddleware
            )
        )
    }
    return createStore(
        rootReducer,
        preloadedState,
        applyMiddleware(
            thunkMiddleware
            // loggerMiddleware
        )
    )
}

preloadedState вернулся как неопределенный в отладчике

полный файл редукторов выглядит так:

import { REHYDRATE } from 'redux-persist/constants'
import _ from 'lodash';
import {
    ADD_DEVICE,
    SYNC_DEVICE,
    DELETE_ALL_DEVICES,
    DELETE_THIS_DEVICE,
    CAN_BE_DELETED,
    HIGHLIGHT_DELETE_ICON,
} from '../actions/device';

// device:Object
// device.macAddress
// device.name
// device.createdAt
// device.updatedAt

export let defaultState = {
    devices: {},
    canBeDeleted: false,
    willBeDeleted: null,

};

export default function (state = defaultState, action) {
    if (action.type === REHYDRATE) {
        let incoming = action.payload.device;
        if (incoming) {
            return {
                ...state,
                ...incoming
            }
        }
        return {
            ...state
        }
    }

    if (action.type === ADD_DEVICE) {
        let device = action.device;
        if (!device || !device.macAddress) {
            return state;
        }
        device.createdAt = new Date();
        device.updatedAt = new Date();
        let devices = _.cloneDeep(state.devices);
        devices[device.macAddress] = device;
        return {
            ...state,
            devices
        }
    }
    if (action.type === SYNC_DEVICE) {
        if (!action.macAddress) {
            return state;
        }
        let devices = state.devices;
        let targetDevice = devices[action.macAddress];
        if (!targetDevice) {
            return state;
        }
        targetDevice.updatedAt = new Date();
        devices[targetDevice.macAddress] = targetDevice;
        return {
            ...state,
            devices
        }
    }
    if (action.type === DELETE_ALL_DEVICES) {
        return {
            ...state,
            devices: {}
        }
    }
    if (action.type === HIGHLIGHT_DELETE_ICON) {
        return {
            ...state,
            canBeDeleted: !state.canBeDeleted
        }
    }
    if (action.type === CAN_BE_DELETED) {
        console.log('reducers/devices.js CANBEDELETED: action and then state', action.deviceItem.props.device.name, state);
        return [
            ...state, {
                canBeDeleted: 'something'
            }
        ]





    }
    if (action.type === DELETE_THIS_DEVICE) {
        // console.log('reducer/device action.type DELETE_THIS_DEVICE', state);
        var listOfDevice = state.devices;
        // console.log('reducer/device action.type delete this device', action);
        // var newObject = listOfDevice.filter(olive => olive.name != action.deviceName)
        // console.log('reducer/device action.type delete this device newObject', newObject);

        function filterByName(obj, stringValue) {
            // console.log('filterByName: new key for object', Object.keys(listOfDevice))
            return Object.keys(obj).reduce((resultObj, key) => {
                const obj = listOfDevice[key]
                // console.log('filterByName: obj', obj);
                if (obj.name !== stringValue) {
                    console.log('here is your resultobj ', resultObj)
                    resultObj[key] = { ...obj }
                }
                return resultObj
            }, {})
        }

        const newObj = filterByName(listOfDevice, action.deviceName);
        // console.log(newObj);

        return {
            ...state,
            devices: newObj,
        }
    }
    return state;
}

1 Ответ

0 голосов
/ 30 октября 2018

Не могу не почувствовать, что, возможно, отсутствует фрагмент кода, который меняет ваше состояние. Если бы вы могли опубликовать пример кода CodePen, возможно, это поможет отладить вашу проблему. Еще одна вещь, на которую стоит обратить внимание, - используете ли вы какое-либо постоянное состояние (например, localStorage values) в вашем createStore

...