import { useEffect } from 'react' ; import { CellType } from './Cell' ; const useTabChange = ( curCell , setCurCell , cacheSource , dataIndexMap ) => { useEffect ( ( ) => { function getNextRowIndex ( preRowIndex , dataSource ) { const length = dataIndexMap . length ; let i = preRowIndex + 1 ; while ( dataSource [ i ] && dataSource [ i ] . editable === false ) { i ++ ; } return length > i ? i : preRowIndex ; } function handleTabChange ( e ) { if ( e . keyCode === 9 && curCell !== null ) { e . preventDefault ( ) ; const { rowIndex , dataIndex } = curCell ! ; const dataIndexMapItem = dataIndexMap [ rowIndex ] ; const index = dataIndexMapItem . indexOf ( dataIndex ) ; const changeRow = index === dataIndexMapItem . length - 1 ; const nextRow = getNextRowIndex ( rowIndex , cacheSource ) ; const canChangeRow = cacheSource . length - 1 >= rowIndex + 1 && nextRow !== rowIndex ; let nextCell ; if ( changeRow && ! canChangeRow ) { nextCell = null ; } else { nextCell = { rowIndex : changeRow ? nextRow : rowIndex , dataIndex : changeRow ? dataIndexMap [ nextRow ] [ 0 ] : dataIndexMapItem [ index + 1 ] , } ; } setCurCell ( nextCell ) ; } } window . addEventListener ( 'keydown' , handleTabChange ) ; return ( ) => { window . removeEventListener ( 'keydown' , handleTabChange ) ; } ; } ) ; } ; export default useTabChange ;