简介

X-Next致力打造一套最好看、最好用的Vue3 UI组件库。

安装

运行

pnpm i x-next

引入

// main.ts
import { createApp } from 'vue'
import XNext from 'x-next'
import "x-next/dist/style.css"; //引入组件样式
import App from './App.vue'

const app = createApp(App)

app.use(XNext)
app.mount('#app')

目前已完成的组件

XButton: (typeof import('x-next'))['Button']
XDialog: (typeof import('x-next'))['Dialog']
XMessage: (typeof import('x-next'))['Message']
XMessageBox: (typeof import('x-next'))['MessageBox']
XNotification: (typeof import('x-next'))['Notification']
XSpace: (typeof import('x-next'))['Space']
XPopconfirm: (typeof import('x-next'))['Popconfirm']
XTrendChart: (typeof import('x-next'))['TrendChart']
XTimeline: (typeof import('x-next'))['Timeline']
XTimelineItem: (typeof import('x-next'))['TimelineItem']
XPopup: (typeof import('x-next'))['Popup']
XScrollbar: (typeof import('x-next'))['Scrollbar']
XDrawer: (typeof import('x-next'))['Drawer']
XTag: (typeof import('x-next'))['Tag']
XTooltip: (typeof import('x-next'))['Tooltip']
XImage: (typeof import('x-next'))['Image']
XImagePreview: (typeof import('x-next'))['ImagePreview']
XImagePreviewGroup: (typeof import('x-next'))['ImagePreviewGroup']
XImagePreviewAction: (typeof import('x-next'))['ImagePreviewAction']
XTabPane: (typeof import('x-next'))['TabPane']
XTabs: (typeof import('x-next'))['Tabs']
XButtonGroup: (typeof import('x-next'))['ButtonGroup']
XDropdown: (typeof import('x-next'))['Dropdown']
XDropdownButton: (typeof import('x-next'))['DropdownButton']
XEmpty: (typeof import('x-next'))['Empty']
XDropdownOption: (typeof import('x-next'))['DropdownOption']
XDropdownGroup: (typeof import('x-next'))['DropdownGroup']
XDropdownSubmenu: (typeof import('x-next'))['DropdownSubmenu']
XInput: (typeof import('x-next'))['Input']
XInputGroup: (typeof import('x-next'))['InputGroup']
XInputPassword: (typeof import('x-next'))['InputPassword']
XInputSearch: (typeof import('x-next'))['InputSearch']
XCol: (typeof import('x-next'))['Col']
XGrid: (typeof import('x-next'))['Grid']
XGridItem: (typeof import('x-next'))['GridItem']
XRow: (typeof import('x-next'))['Row']
XForm: (typeof import('x-next'))['Form']
XFormItem: (typeof import('x-next'))['FormItem']
XNetwork: (typeof import('x-next'))['Network']
XStep: (typeof import('x-next'))['Step']
XSteps: (typeof import('x-next'))['Steps']
XCheckbox: (typeof import('x-next'))['Checkbox']
XCheckboxGroup: (typeof import('x-next'))['CheckboxGroup']
XSwitch: (typeof import('x-next'))['Switch']
XRadio: (typeof import('x-next'))['Radio']
XRadioGroup: (typeof import('x-next'))['RadioGroup']
XSelect: (typeof import('x-next'))['Select']
XSelectDropdown: (typeof import('x-next'))['SelectDropdown']
XSelectOption: (typeof import('x-next'))['SelectOption']
XSelectOptionGroup: (typeof import('x-next'))['SelectOptionGroup']
XSpin: (typeof import('x-next'))['Spin']
XInputTag: (typeof import('x-next'))['InputTag']
XProgress: (typeof import('x-next'))['Progress']
XInputNumber: (typeof import('x-next'))['InputNumber']
XSlider: (typeof import('x-next'))['Slider']
XAlert: (typeof import('x-next'))['Alert']
XSkeleton: (typeof import('x-next'))['Skeleton']
XSkeletonLine: (typeof import('x-next'))['SkeletonLine']
XSkeletonShape: (typeof import('x-next'))['SkeletonShape']
XMenu: (typeof import('x-next'))['Menu']
XLayout: (typeof import('x-next'))['Layout']
XLayoutContent: (typeof import('x-next'))['LayoutContent']
XLayoutFooter: (typeof import('x-next'))['LayoutFooter']
XLayoutHeader: (typeof import('x-next'))['LayoutHeader']
XLayoutSidebar: (typeof import('x-next'))['LayoutSidebar']
XResizeBox: (typeof import('x-next'))['ResizeBox']
XMenuItem: (typeof import('x-next'))['MenuItem']
XMenuSubMenu: (typeof import('x-next'))['MenuSubMenu']
XTimeRangeSelector: (typeof import('x-next'))['TimeRangeSelector']
XDraggable: (typeof import('x-next'))['Draggable']
XLink: (typeof import('x-next'))['Link']
XPagination: (typeof import('x-next'))['Pagination']
XTable: (typeof import('x-next'))['Table']
XTableColumn: (typeof import('x-next'))['TableColumn']