配合 Vxe UI 组件库,支持更多可视化组件
推荐使用 npm 的方式安装,它能更好地和 webpack、vite 等打包工具配合使用。
依赖库:vue 3.2+
npm install vxe-table@4.7.87
# 或者
yarn add vxe-table@4.7.87
// ... 纯表格
import VxeTable from 'vxe-table'
import 'vxe-table/lib/style.css'
// ...
// ...可选 UI
import VxeUI from 'vxe-pc-ui'
import 'vxe-pc-ui/lib/style.css'
// ...
createApp(App).use(VxeUI).use(VxeTable).mount('#app')
可以通过第三方开放的 CDN 来引用, unpkg 或 cdnjs 获取到最新版本的资源,并在页面上引入即可
(注:不建议将不受信任的第三方 CDN 用于正式环境,因为该连接随时都可能会失效,导致项目出错,如确实需要使用第三方 CDN 方式记得锁定版本号,锁定版本的方法请查看第三方的说明)
<!-- 引入样式 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vxe-pc-ui@4.2.19/lib/style.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vxe-table@4.7.87/lib/style.css">
<!-- 引入vue -->
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<!-- 引入组件 -->
<script src="https://cdn.jsdelivr.net/npm/xe-utils"></script>
<script src="https://cdn.jsdelivr.net/npm/vxe-pc-ui@4.2.19"></script>
<script src="https://cdn.jsdelivr.net/npm/vxe-table@4.7.87"></script>