在前端开发中，常常需要用到表格来展示数据。@beisen-phoenix/table 帮助我们快速简单地创建表格组件，能够帮助我们减少开发成本，提高开发效率，从而让我们更集中精力在业务上。
安装与引用
在命令行中使用 npm 进行安装：
npm install @beisen-phoenix/table
在你的 JS 文件中，使用以下代码进行引入：
import Table from '@beisen-phoenix/table';
快速使用
基本用法
-- -------------------- ---- -------
-------
-------
----
-----------
-----------
-----------
-----
--------
-------
----
-----------
----------
-----------
-----
----
-----------
----------
-----------
-----
--------
--------
--------
----- ----- - --- ---------------
---------------
---------以上代码即可渲染出一个简单的表格。new Table 的参数为选择器，指向要渲染的表格。
带有排序的表格
-- -------------------- ---- -------
-------
-------
----
-----------
-----------
-----------
-----
--------
-------
----
-----------
----------
-----------
-----
----
-----------
----------
-----------
-----
----
-----------
----------
-----------
-----
--------
--------
--------
----- ----- - --- -------------- -
----- -----
--------------- ------ ----- -----
---
---------------
---------以上代码即可渲染出一个带有排序功能的表格。sort 参数为 true 表示启用排序功能。fieldsWithSort 参数为要启用排序功能的字段名数组。
带有分页的表格
-- -------------------- ---- -------
-------
-------
----
-----------
-----------
-----------
-----
--------
-------
----
-----------
----------
-----------
-----
----
-----------
----------
-----------
-----
----
-----------
----------
-----------
-----
----
-----------
----------
-----------
-----
----
-----------
----------
-----------
-----
----
-----------
----------
-----------
-----
----
------------
----------
-----------
-----
----
------------
----------
-----------
-----
----
------------
----------
-----------
-----
----
------------
----------
-----------
-----
----
------------
----------
-----------
-----
----
------------
----------
-----------
-----
--------
--------
--------
----- ----- - --- -------------- -
--------- -----
--------- -
---
---------------
---------以上代码即可渲染出一个带有分页功能的表格。pageable 参数为 true 表示启用分页功能。pageSize 参数为每页显示的数据行数。
结语
以上就是 @beisen-phoenix/table 使用教程。希望这篇文章能够帮助你在前端开发中更加高效地使用表格组件。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/136503