react-row-select-table


simple data table react Component

!image

Installation

``js
npm i react-row-select-table
`

Usage

$3

`js
import React from "react"
import Table, {Thead, Tbody, Tr, Th, Td} from "react-row-select-table"

const Custom = () => (

console.log(value)} defaultCheckeds={[1,3]}>

id	name
1	tarou
2	zirou
3	subrou

)
`

$3

#### Table
`js
import Table from "react-row-select-table"

render (

{}} defaultCheckeds={[]} >...)
`

|name|Type|default|Description|
|:---|:---|:---|:---|
|onCheck|func||Callback checked indexs

Signature:
function(values: Array) => void|
|defaultCheckeds|Array|[]|default checked indexs|

#### Tr
`js
import { Tr } from "react-row-select-table"

render (

...)
`

|name|Type|default|Description|
|:---|:---|:---|:---|
|isCheckRow|boolean|true|Set the check box check box to Row|

Design Customize

`js
import React from "react"
import {BaseTable ,Thead, Tbody, Tr, Th, Td} from "react-row-select-table"
import styled from "styled-components"

const Table = styled(BaseTable)
table {
width: 100%;
border-collapse: collapse;

tr {
border-bottom: 1px solid #ddd;
}

tr.tr-body:hover {
background-color: #f5f5f5;
}

tr.tr-checked {
background-color: #f5f5f5;
}

th {
padding: 0.5rem;
text-align: left;
}

td {
padding: 0.5rem;
text-align: left;
}
}


const Custom = () => (


console.log(value)} defaultCheckeds={[1,3]}>






















id	name
1	tarou
2	zirou
3	subrou


)
``

DEMOS

* examples
* https://wheatandcat.github.io/examples-pages/react-row-select-table/index.html?v1

* storybook
* https://wheatandcat.github.io/react-row-select-table/