Installation

Buat projek baru dan install NPM yg ada di dokumentasi

Lalu ubah App.js seperti di bawah :

import React, {Component} from "react";
import './App.css';

class App extends Component {
  state ={
    posts: []
  };

  handleAdd = () => {
    console.log("Add");
  }

  handleUpdate = post => {
    console.log("Update", post);
  }

  handleDelete = post => {
    console.log("Delete", post);
  }

  render() {
    return (
      <>
        <button className="btn btn-primary" onClick={this.handleAdd}>
          Add
        </button>
        <table class="table">
          <thead>
            <tr>
              <th>Title</th>
              <th>Update</th>
              <th>Delete</th>
            </tr>
          </thead>
          <tbody>
            {this.state.posts.map(post => {
              <tr key={post.id}>
                <td>{post.title}</td>
                <td>
                  <button
                    className="btn btn-info btn-sm"
                    onClick={() => this.handleUpdate(post)}
                  >
                    Update
                  </button>
                </td>
                <td>
                  <button
                    className="btn btn-danger btn-sm"
                    onClick={() => this.handleDelete(post)}
                  >
                    Delete
                  </button>
                </td>
            </tr>
            })}
          </tbody>
        </table>
      </>
    );
  }
}

export default App;

Import bootstrap di index.js

import "bootstrap/dist/css/bootstrap.css"

Last updated

Was this helpful?