CODEWITHSUNDEEP
javascriptreactjsreduxreact-reduxreducers
ganesh kaspate
ganesh kaspate

Reputation: 2695

State is not getting initialized to the initial state

I am new to the react-redux.

Now I have an object which is like ,

const initialState = {
        Low: [
            {
                id: 0,
                technologyId: 0,
                technology: '',
                level: 'EASY'
            }
        ],
        Medium: [
            {
                id: 0,
                technologyId: 0,
                technology: '',
                level: 'MEDIUM'
            }
        ],
        High: [
            {
                id: 0,
                technologyId: 0,
                technology: '',
                level: 'TOUGH'
            }
        ]
    }

Now, 

    export default function QuizData(state = initialState, action) {
        switch (action.type) {
            case QUIZ_DATA:
                return {
                    ...state,
                    Low: action.data,
                    error: false,
                } 
            case RESET_SETUP_QUIZ: {
            console.log("intial state is ",  ...state);
            return {
                ...state
            }

Now, here what happens is after some manipulations, this objects gets changes with every key is having some values. like,

So, This gets changed.

{
        Low: [
            {
                id: 0,
                technologyId: 11,
                technology: 'xsxs',
                level: 'EASY'
            }
        ],
        Medium: [
            {
                id: 0,
                technologyId: 22,
                technology: 'swwsw',
                level: 'MEDIUM'
            }
        ],
        High: [
            {
                id: 0,
                technologyId: 110,
                technology: 'xsxsx',
                level: 'TOUGH'
            }
        ]
    }

Now, what I want to do is that ,

When user clicks a button that time I want to change this to the initial state.

So that it will not have any values as it should be same as by default.

SO, what I tried it

return {
   initalState
}

But then I tried with the object.assign.

case QUIZ_DATA:
  return Object.assign(
    {},
    state,
    {
      Low: action.data,
      error: false
    }
  )

But still Here it copies only the first level of variables.

So, Still I am not able to do this .

Can any one help me with this ?

Upvotes: 1

Views: 154

Answers (4)

Michael
Michael

Reputation: 328

This is wrong:

case RESET_SETUP_QUIZ: {
        console.log("intial state is ",  ...state);
        return {
            initialState
        }

You should 

case RESET_SETUP_QUIZ: {
        console.log("intial state is ", initialState);
        return initialState;

Or

 case RESET_SETUP_QUIZ: {
        console.log("intial state is ", initialState);
        return {
           ...initialState
        };

Upvotes: 1

Tenzin Kunkyab
Tenzin Kunkyab

Reputation: 123

Notice that you're not returning anything for default condition of action.type. Return the state on default:. Second thing the return { ...state, low: action.data, error: false } should work right out of the box. 

export default function QuizData(state = initialState, action) {
    switch (action.type) {
        case QUIZ_DATA:
            return {
                ...state,
                Low: action.data,
                error: false,
            } 
        case RESET_SETUP_QUIZ: {
            console.log("intial state is ",  ...state);
            return {
                ...state
            }
        }
        default: {
            return state;
        }
    }
}

Upvotes: 1

Max
Max

Reputation: 1567

To reset to the initial state all you have to do is:

case RESET_SETUP_QUIZ: {
    return initialState;

That's it. When the reducer function is called after the first time, state will be the current state, not initial state.

Upvotes: 1

Anil Kumar
Anil Kumar

Reputation: 2309

Object.assign will not help with deep copy.

If you want to do deep copy use.

let newObj = JSON.parse(JSON.stringify(obj));

here newObj will be deep copy.

Upvotes: 1

Related Questions