'how to use react table Selection without checkbox?(ctrl &shift Selection)

how to implement the ctrl + click and Shift + click in the react-Table selection for the selection the rows and get there values

please help

code:-

                <table {...getTableProps()} className="table" >
                    <thead>
                        {headerGroups.map(headerGroup => (
                            <tr {...headerGroup.getHeaderGroupProps()} id="header-fixed">
                                {headerGroup.headers.map(column => (
                                    <th {...column.getHeaderProps()}>{column.render('Header')}</th>
                                ))}
                            </tr>
                        ))}
                    </thead>
                    <tbody {...getTableBodyProps()}>
                        {rows.map((row, i) => {
                            prepareRow(row)
                            return (
                                <tr {...row.getRowProps({onClick:()=>{
                                    console.log("ROW",row.id);
                                }})} className="border_bottom" tabIndex={i} onKeyDown={(e) => handleKeyDown(e, i)} onLoad={() => active(i)} ref={i === 0 ? myRef : null}>
                                    {row.cells.map(cell => {
                                        return <td {...cell.getCellProps()}>{cell.render('Cell')}</td>
                                    })}
                                </tr>
                            )
                        })}
                    </tbody>
                </table>


Solution 1:[1]

You need to add a class conditionally to the tr.

And to make it conditional you will need to have a record of selected items.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Ali Hussnain