gridjs实现带自定义搜索排序分页的自适应响应式表格效果代码-html代码-BFW代码库

gridjs实现带自定义搜索排序分页的自适应响应式表格效果代码

代码语言：html

所属分类：表格

代码描述：gridjs实现带自定义搜索排序分页的自适应响应式表格效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">

  
  
<style>
body {
  font-family: monospace;  
}

h1 {
  text-align: center;
}

#table {
  margin: 50px auto;
}

.table-body {
  color: #323333;
}
</style>

<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/mermaid.min.css">

</head>

<body>

<h1>Table Using Grid.js</h1>
<div id="table"></div>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/gridjs.umd.js"></script>
      <script  >
new gridjs.Grid({
  columns: ["Name", "Email", "Phone Number", "Gender"],
  search: true,
  sort: true,
  pagination: {
    limit: 5 },

  data: () => {
    return new Promise(resolve => {
        //模拟ajax请求
      setTimeout(() =>
      resolve([
      ["Dirk", "dborkett0@com.com", "(646) 3432270", "Male"],
      ["Maryl", "mchampkins1@dailymail.co.uk", "(980) 3335235", "Female"],
      ["Stefan", "sbrawson2@smh.com.au", &.........完整代码请登录后点击上方下载按钮下载查看