title: React react-data-table-component Add Event in Row Button
body: <p>data-table-component and added button on first column but when i am clicking button i am not able to get row value. here is my code.</p>
  
  <pre><code>import Page from 'components/Page';
  import React from 'react';
  import {
    Button,
    Card,
    CardBody,
    CardHeader,
    Col,
    FormFeedback,
    FormGroup,
    FormText,
    Input,
    Label,
    Row,
  } from 'reactstrap';
  import axios from 'axios';
  import DataTable , { memoize } from 'react-data-table-component';
  import { LoadingOverlay, Loader } from 'react-overlay-loader';
  import 'react-overlay-loader/styles.css';
  const columns = memoize(clickHandler =&gt; [
    {
      cell:() =&gt; &lt;button onClick={clickHandler} &gt;Action&lt;/button&gt;,
      ignoreRowClick: true,
      allowOverflow: true,
      button: true,
    },
    {
      name: 'ID',
      selector: 'ID',
      sortable: true,
      grow: 2,
    },
    {
      name: 'Name',
      selector: 'name',
      sortable: true,
      grow: 2,
    },
    {
      name: 'Class',
      selector: 'class',
      sortable: true,
    },
  
  ]);
  const viewQuery ="SELECT ID,name,class FROM school ";
   class DTable extends React.Component {
      constructor(props) {
          super(props);
          this.state = {
              viewdata:{},
              loading:false,
              selectedRows: []
  
          };
        }
    viewData(){
  
      axios({
        method: 'post',
        url: '',
        data: {query:viewQuery},
        crossDomain: true,
        headers: {
            'Content-type': 'multipart/form-data'
          }
        })
        .then(response =&gt; {
           this.setState({ viewdata: response.data });
  
           //console.log(response)
          })
        .catch(function (response) {
            //handle error
            console.log(response);
        });
    } 
   componentDidMount() {
         this.viewData();
  
   }
   handleButtonClick = () =&gt; {
      console.log('clicked');
    };
    handleChange = state =&gt; {
      console.log('state', state.selectedRows);
  
      this.setState({ selectedRows: state.selectedRows });
    };
    render(){
    return (
      &lt;Page title="Forms" breadcrumbs={[{ name: 'Forms', active: true }]}&gt;
        &lt;Row&gt;
          &lt;Col xl={7} lg={12} md={12}&gt;
            &lt;Card&gt;
              &lt;CardHeader&gt;Input Types&lt;/CardHeader&gt;
              &lt;CardBody&gt;
                  &lt;DataTable
                  title="Created Form"
  
                  data={this.state.viewdata}
                  columns={columns(this.handleButtonClick)}
                  onRowSelected={this.handleChange}
                  selectableRows
                  pagination
                  dense
                  /&gt;
              &lt;/CardBody&gt;
            &lt;/Card&gt;
          &lt;/Col&gt;
        &lt;/Row&gt;
      &lt;/Page&gt;
    );
  }
  }
  export default DTable;
  </code></pre>
  
  <p>How to Get value of clicked button row. in handleButtonClick i am getting undefined value.</p>
  
  <p>Hi i updated here My Complete Code i using react-data-table-component library i already read its all doc. but i am not able to get clicked row value. </p>