vue3 中 如何使用 Vxe UI

552 阅读1分钟

Vxe UI vue3 中 如何使用 Vxe UI

官方文档 vxeui.com
查看 githubgitee

NPM 安装

npm install vxe-table@v4-latest vxe-pc-ui@v4-latest

引入

// ...
import VxeUITable from 'vxe-table'
import 'vxe-table/lib/style.css'
// ...

import VxeUI from 'vxe-pc-ui'
import 'vxe-pc-ui/lib/style.css'
// ...

createApp(App).use(VxeUI).use(VxeUITable).mount('#app')
// ...

CDN 安装

CDN 安装也一样,引入对应版本的 js 和css 就可以了

<!-- 引入样式 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vxe-pc-ui@v4-latest/lib/style.css">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vxe-table@v4-latest/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@v4-latest"></script>
<script src="https://cdn.jsdelivr.net/npm/vxe-table@v4-latest"></script>