cldV2react/src/hooks/useAutoTable.js

import { useState, useEffect } from 'react'
import { useDebounceFn } from 'ahooks'
import { useStore } from 'dva'
/**
 *
 * @param {number} needSubtractHeight 被裁去的高度
 * @param {number} needSubtractWidth 被裁去的宽度
 */
const useAutoTable = (needSubtractHeight, needSubtractWidth) => {
  const { collapsed = true } = useStore().getState().global
  const [scroll, setScroll] = useState({
    x: document.body.clientWidth - ((collapsed ? 208 : 48) + needSubtractWidth),
    y: document.body.clientHeight - needSubtractHeight
  })
  // const { run, cancel } = useDebounceFn(handleScroll, { wait: 5000})
  const { run, cancel } = useDebounceFn(() =>
    setScroll({
      ...scroll,
      x: document.body.clientWidth - ((collapsed ? 208 : 48) + needSubtractWidth),
      y: document.body.clientHeight - needSubtractHeight
    })
  )
  useEffect(() => {
    run()
    return () => cancel()
  }, [collapsed])
  useEffect(() => {
    window.addEventListener('resize', run)
    return () => {
      window.removeEventListener('resize', cancel)
    }
  }, [])

  // 实际返回的宽度要大一点让table出现滚动条，反正折叠菜单栏卡顿
  return [scroll.x + 50, scroll.y]
}

export default useAutoTable