Repository: element-plus/element-plus
File: packages/components/table/src/table-header/index.ts (TypeScript)

Code before:
      required: true,
      type: Object as PropType<TableHeaderProps<DefaultRow>['store']>,
    },
    border: Boolean,
    defaultSort: {
      type: Object as PropType<TableHeaderProps<DefaultRow>['defaultSort']>,
      default: () => {
        return {
          prop: '',
          order: '',
        }
      },
    },
    appendFilterPanelTo: {
      type: String,
    },
  },
  setup(props, { emit }) {
    const instance = getCurrentInstance() as TableHeader
    const parent = inject(TABLE_INJECTION_KEY)
    const ns = useNamespace('table')
    const filterPanels = ref({})
    const { onColumnsChange, onScrollableChange } = useLayoutObserver(parent!)

    const isTableLayoutAuto = parent?.props.tableLayout === 'auto'
    const saveIndexSelection = reactive(new Map())
    const theadRef = ref()

    const updateFixedColumnStyle = () => {
      setTimeout(() => {
        if (saveIndexSelection.size > 0) {
          saveIndexSelection.forEach((column, key) => {
            const el = theadRef.value.querySelector(
              `.${key.replace(/\s/g, '.')}`
            )
            if (el) {
              const width = el.getBoundingClientRect().width
              column.width = width
            }
          })
          saveIndexSelection.clear()
        }
      })
    }

    onMounted(async () => {
      // Need double await, because updateColumns is executed after nextTick for now
      await nextTick()
      await nextTick()
      const { prop, order } = props.defaultSort
      parent?.store.commit('sort', { prop, order, init: true })

Review comment (suggestion):
```suggestion
    const saveIndexSelection = new Map()
```

IMO, the `reactive` are not necessary. WDYT

Code after:
      type: Object as PropType<TableHeaderProps<DefaultRow>['store']>,
    },
    border: Boolean,
    defaultSort: {
      type: Object as PropType<TableHeaderProps<DefaultRow>['defaultSort']>,
      default: () => {
        return {
          prop: '',
          order: '',
        }
      },
    },
    appendFilterPanelTo: {
      type: String,
    },
  },
  setup(props, { emit }) {
    const instance = getCurrentInstance() as TableHeader
    const parent = inject(TABLE_INJECTION_KEY)
    const ns = useNamespace('table')
    const filterPanels = ref({})
    const { onColumnsChange, onScrollableChange } = useLayoutObserver(parent!)

    const isTableLayoutAuto = parent?.props.tableLayout === 'auto'
    const saveIndexSelection = new Map()
    const theadRef = ref()

    const updateFixedColumnStyle = () => {
      setTimeout(() => {
        if (saveIndexSelection.size > 0) {
          saveIndexSelection.forEach((column, key) => {
            const el = theadRef.value.querySelector(
              `.${key.replace(/\s/g, '.')}`
            )
            if (el) {
              const width = el.getBoundingClientRect().width
              column.width = width
            }
          })
          saveIndexSelection.clear()
        }
      })
    }

    onMounted(async () => {
      // Need double await, because updateColumns is executed after nextTick for now
      await nextTick()
      await nextTick()
      const { prop, order } = props.defaultSort
      parent?.store.commit('sort', { prop, order, init: true })