篩選表格後再點擊上方的條目篩選,表格依然是篩選態的解決辦法

思路:
table子組件監聽傳入值,聲明一個ref默認爲false,在監聽傳入值的effect裏,將refcurrent變成true,在表格的onchange方法內將ref變成false,在每次拿到table數據的返回值時,判斷ref的值是否爲true,是則遍歷表頭,通過表頭子項的filterSearch來判斷是否是篩選項,是則將該值賦爲null

import { useEffect, useState, useRef } from 'react'

export default function MyTable (prop) {
    const{listenData} = prop
    const hasChangeRef = useRef(false)
 useEffect(() => {
    if (!listenData.length) return
    hasChangeRef.current = true
    getTableResource()
}, [listenData])

const getTableResource = async()=>{
   const res = await getAjax()
   const {columns} = res
         if (hasChangeRef.current) {
          columns.forEach(element => {
            if (element.filterSearch) {
              element.filteredValue = null
            }
          })
        }
//   oth...
}
return    <Table  {...tableResource}
        onChange={(pagination, filter) => {
        // 這裏,將其設爲false
          hasChangeRef.current = false
          getTableResource(pagination)
        }}
      />
}

大致邏輯是這樣,時間太緊有的就省略了。
以上。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章