1.0.29 • Published 2 years ago
dr.table v1.0.29
dr.table
pure, small and estetics data table. available in vanilla, vue, react and svelte.
Demo : https://codepen.io/alanshalih/pen/mdXNPNP
Installation
npm i dr.table
Usage
1. Vanilla JS
<table id="my-table">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
</tr>
</thead>
<tbody>
<tr>
<td>Maulana Shalihin</td>
<td>maulanashalihin@gmail.com</td>
<td>6281351000000</td>
</tr>
</tbody>
</table>
<script>
import DRTable from "dr.table"
new DRTable("#my-table")
</script>
Vue.js 3
<script setup>
import DRTable from 'dr.table/vue'
</script>
<template>
<DRTable>
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
</tr>
</thead>
<tbody>
<tr>
<td>Maulana Shalihin</td>
<td>maulanashalihin@gmail.com</td>
<td>6281351000000</td>
</tr>
</tbody>
</DRTable>
</template>
React
import Table from "dr.table"
import "dr.table/style.css"
import { useEffect } from "react";
export default function DRTable(props) {
useEffect(() => {
//Runs only on the first render
const mytable = new Table("#dr-table")
}, []);
return (
<div>
<table className="invisible" id="dr-table">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
</tr>
</thead>
<tbody>
<tr>
<td>Maulana Shalihin</td>
<td>maulanashalihin@gmail.com</td>
<td>6281351000000</td>
</tr>
</tbody>
</table>
</div>
)
}
Svelte
<script>
import DRtable from "dr.table/svelte"
</script>
<DRtable>
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
</tr>
</thead>
<tbody>
<tr>
<td>Maulana Shalihin</td>
<td>maulanashalihin@gmail.com</td>
<td>6281351000000</td>
</tr>
</tbody>
</DRtable>
Credit
rewrite from JSTable https://github.com/jstable/JSTable
1.0.29
2 years ago
1.0.28
2 years ago
1.0.27
2 years ago
1.0.26
2 years ago
1.0.24
2 years ago
1.0.23
2 years ago
1.0.22
2 years ago
1.0.21
2 years ago
1.0.20
2 years ago
1.0.19
2 years ago
1.0.18
2 years ago
1.0.17
2 years ago
1.0.16
2 years ago
1.0.15
2 years ago
1.0.14
2 years ago
1.0.13
2 years ago
1.0.12
2 years ago
1.0.11
2 years ago
1.0.10
2 years ago
1.0.9
2 years ago
1.0.8
2 years ago
1.0.7
2 years ago
1.0.6
2 years ago
1.0.5
2 years ago
1.0.4
2 years ago
1.0.3
2 years ago
1.0.1
2 years ago
1.0.0
2 years ago
0.0.1
2 years ago