Object assign with dynamic variable

Question

I have this initialState in my Redux store:

const initialState = {
  isFetching : false,
  active     : {}
}

Where active is an object.

Now I have an action that should append or add a property to active’s data property, like so:

[DASHBOARD_TEMPLATE_DATA_RECEIVE]: (state, action) => {
    return Object.assign({}, state, {
      isFetching   : false,
      active       : Object.assign({}, active, {data[action.key]: action.data})
    })
}

As you can see, data[action.key] is not permitted. How do I do it?

Answer 1

Try with this:

active: Object.assign({}, active, {
  data: Object.assign({}, data, {
    [action.key]: action.data
  })
})

Answer 2

Build the object up first, making use of square bracket notation to use a string as a property name:

var data = {};
data[action.key] = action.data;

then use that newly created object:

[DASHBOARD_TEMPLATE_DATA_RECEIVE]: (state, action) => {
    return Object.assign({}, state, {
      isFetching   : false,
      active       : Object.assign({}, active, data)
    })
}