[英]How to create data tables in an electron app
我正在用电子创建一个应用程序,我正在尝试使用 jquery 处理数据表。
但是当我在 html 文件中执行此操作以及当我想对其进行测试时:
1 -> 网页:它在我的浏览器中工作 2 -> 电子应用程序:它不起作用,它只显示表格而不显示数据表功能,如搜索或其他
我应该如何解决这个问题?
您需要使用 NPM 安装数据表:
npm install --save datatables.net-dt
PS:如果没有,请确保 jquery 也安装在您的节点模块中,请使用npm install --save jquery
并将此代码添加到您的 html 页面中:
<script> window.jQuery = window.$ = require('jquery'); </script>
为了能够使用包中选定的软件,请使用以下代码:
require( 'datatables.net-dt' )();
现在将 HTML 表格代码放入 html 页面并使用 jquery 调用 css 文件和数据表的功能:
HTML
<table id="table_id" class="display">
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
</tr>
</thead>
<tbody>
<tr>
<td>Row 1 Data 1</td>
<td>Row 1 Data 2</td>
</tr>
<tr>
<td>Row 2 Data 1</td>
<td>Row 2 Data 2</td>
</tr>
</tbody>
</table>
css
<link rel="stylesheet" href="node_modules/datatables.net-bs4/css/dataTables.bootstrap4.min.css">
Javascript
<script src="node_modules/datatables.net-bs4/js/dataTables.bootstrap4.min.js"></script>
<script>
$(document).ready( function () {
$('#table_id').DataTable();
} );
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.