JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.5.0/bootstrap-table.min.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/bootstrap-table/1.5.0/bootstrap-table.min.js"></script>
<div class="panel panel-default">
  <!-- Default panel contents -->
  <div class="panel-heading">Articles</div>
  <!-- Table -->
  <table data-url="http://wenzhixin.net.cn/examples/bootstrap_table/data"  data-pagination="true" data-page-list="[5, 10, 20, 50, 100, 200]" data-search="true" data-toggle="table" id="table">
    <thead>
    <tr>
        <th data-field="state" data-checkbox="true"></th>
        <th data-field="id" data-align="right" data-sortable="true">Item ID</th>
        <th data-field="name" data-align="center" data-sortable="true">Item Name</th>
        <th data-field="price" data-sortable="true">Item Price</th>
    </tr>
    </thead>
</table>
</div>