fix(components): [table-footer] update cols width on layout change (#19064)

fix(components): [table-footer]

update cols width on layout change

closed #19054

Co-authored-by: sea <45450994+warmthsea@users.noreply.github.com>

packages/components/table/src/table-footer/index.ts

@@ -1,6 +1,8 @@
 // @ts-nocheck
-import { defineComponent, h } from 'vue'
+import { defineComponent, h, inject } from 'vue'
 import { useNamespace } from '@element-plus/hooks'
+import useLayoutObserver from '../layout-observer'
+import { TABLE_INJECTION_KEY } from '../tokens'
 import useStyle from './style-helper'
 import type { Store } from '../store'
 
@@ -43,12 +45,17 @@ export default defineComponent({
     },
   },
   setup(props) {
+    const parent = inject(TABLE_INJECTION_KEY)
+    const ns = useNamespace('table')
     const { getCellClasses, getCellStyles, columns } = useStyle(
       props as TableFooter<DefaultRow>
     )
-    const ns = useNamespace('table')
+    const { onScrollableChange, onColumnsChange } = useLayoutObserver(parent!)
+
     return {
       ns,
+      onScrollableChange,
+      onColumnsChange,
       getCellClasses,
       getCellStyles,
       columns,