更改对象的read only属性

需求：

在项目开发中，拖拽左侧的数据新增到日历面板上，这时会调后端新增接口，但是我不想刷新日历组件，所以需要后面新增接口的回调返回新增这条数据的id，在新增接口回调中前端手动将id绑定到对应数据。

问题

info.event是日历单个event的所有属性，info.event下的属性是面板的自有属性，其它非自有属性都在info.event.extendedProps里面

直接使用 info.event.extendedProps.planId = res.data.iid

报错 Cannot assign to read only property 'planId' of object

planId是 read only属性，不能更改

解决办法

const newProps = cloneDeep(info.event.extendedProps)
Object.defineProperties(info.event, {
      extendedProps: {
        value: newProps,
        writable: true // 👈️ 将属性设置为可写
      }
 })
Object.assign(info.event.extendedProps, { planId: res.data.iid })

Object.defineProperties()
是 JavaScript 中的一个方法，它允许你一次性定义或修改一个对象上的多个属性。这个方法接收两个参数：要定义属性的对象和一个描述符对象，其中描述符对象的属性键是要定义的属性名，值是对应的属性描述符对象。

• value：属性的值。
• writable：如果为 true，属性的值可以被改变。
• enumerable：如果为 true，属性可以被枚举（例如，通过 for...in 循环或 Object.keys() 方法）。
• configurable：如果为 true，属性的类型可以被改变，属性也可以被删除。

这个处理能暂时改变extendedProps的值，但是在fullcalendar组件中，并不会影响内部的真实的extendedProps值

所以真正的对于这个fullcalendar的组件的方式是info.event.setExtendedProp('planId', res.data.iid)
组件提供了一个修改extendedProps的方法