I want to set certain property of initial state to be relative to other property. So I used this inside of it.

const initialState = {
  canvas_1: {
    canvasName: "canvas_1",
    top: 500,
    left: 600,
    width: 390,
    height: 800,
    xAxisSnap: [0, this.width / 2, this.width],   <-- here
    yAxisSnap: [0, this.height / 2, this.height], <-- here
    selectedShapes: [],
    children: ["hi"],
  },
};

const canvasSlice = createSlice({
  name: "canvas",
  initialState: initialState,
  reducers: {},
});

export const selectShapesOnCanvas = (state) => state.canvas.present.children;

export const {} = canvasSlice.actions;

export default canvasSlice.reducer;

But this is what I got in return from webpack.

var initialState = {
  canvas_1: {
    canvasName: "canvas_1",
    top: 500,
    left: 600,
    width: 390,
    height: 800,
    xAxisSnap: [0, undefined.width / 2, undefined.width],   <-- here
    yAxisSnap: [0, undefined.height / 2, undefined.height], <-- here
    selectedShapes: [],
    children: ["hi"]
  }
};
var canvasSlice = (0,_reduxjs_toolkit__WEBPACK_IMPORTED_MODULE_0__.createSlice)({
  name: "canvas",
  initialState: initialState,
  reducers: {}
});
var selectShapesOnCanvas = function selectShapesOnCanvas(state) {
  return state.canvas.present.children;
};

_objectDestructuringEmpty(canvasSlice.actions);


/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (canvasSlice.reducer);

Am I using this the wrong way, or is it not allowed to use this in RTK?