Parent.js

import React, { Component } from "react";
import axios from "axios";
import Button from "../Button";
import { Checkbox } from "antd";

class Models extends Component {
  state = {
    models: [],
    selected: {}
  };

  onChange = id => {
    this.setState(prevState => ({
      selected: { ...prevState, [id]: !prevState[id] }
    }));
  };

  reset = e => {
    this.setState({ selected: {} });
  };

  async componentDidMount() {
    await axios.get("https://jsonplaceholder.typicode.com/users").then(res => {
      const models = res.data;
      this.setState({ models });
    });
  }

  render() {
    const { models, selected } = this.state;
    return (
      <div>
        <table>
          <thead>
            <tr>
              <th>Model Name</th>
              <th>Timestamp</th>
              <th>Select</th>
            </tr>
          </thead>
          <tbody>
            {models.map(model => (
              <tr key={model.id}>
                <td>{model.name}</td>
                <td>{model.address.zipcode}</td>
                <td>
                  <Checkbox
                    checked={selected[model.id]}
                    onChange={() => this.onChange(model.id)}
                  />
                </td>
              </tr>
            ))}
          </tbody>
        </table>
        <Button name="Reset" classType="default" click={() => this.reset()} />
        <Button name="Compare" classType="primary" />
      </div>
    );
  }
}

export default Models;