perf: improve the usage documentation of vben-vxe-table (#4829)

* perf: improve the usage documentation of vben-vxe-table
This commit is contained in:
Vben
2024-11-06 23:03:33 +08:00
committed by GitHub
parent 33ce4d3cf3
commit 4e88ef0840
31 changed files with 720 additions and 888 deletions

View File

@@ -1,14 +1,10 @@
<script lang="ts" setup>
import type {
UseVbenVxeGrid,
VxeGridListeners,
VxeGridProps,
} from '#/adapter/vxe-table';
import { inject } from 'vue';
import type { VxeGridListeners, VxeGridProps } from '#/adapter/vxe-table';
import { Button, message } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { MOCK_TABLE_DATA } from '../table-data';
interface RowType {
@@ -20,10 +16,6 @@ interface RowType {
role: string;
}
const useVbenVxeGrid = inject<UseVbenVxeGrid>(
'useVbenVxeGrid',
) as UseVbenVxeGrid;
const gridOptions: VxeGridProps<RowType> = {
columns: [
{ title: '序号', type: 'seq', width: 50 },

View File

@@ -1,10 +1,10 @@
<script lang="ts" setup>
import type { UseVbenVxeGrid, VxeGridProps } from '#/adapter/vxe-table';
import { inject } from 'vue';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button, Image, Switch, Tag } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { getExampleTableApi } from '../mock-api';
interface RowType {
@@ -19,10 +19,6 @@ interface RowType {
status: 'error' | 'success' | 'warning';
}
const useVbenVxeGrid = inject<UseVbenVxeGrid>(
'useVbenVxeGrid',
) as UseVbenVxeGrid;
const gridOptions: VxeGridProps<RowType> = {
checkboxConfig: {
highlight: true,

View File

@@ -1,7 +1,7 @@
<script lang="ts" setup>
import type { UseVbenVxeGrid, VxeGridProps } from '#/adapter/vxe-table';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { inject } from 'vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { getExampleTableApi } from '../mock-api';
@@ -14,10 +14,6 @@ interface RowType {
releaseDate: string;
}
const useVbenVxeGrid = inject<UseVbenVxeGrid>(
'useVbenVxeGrid',
) as UseVbenVxeGrid;
const gridOptions: VxeGridProps<RowType> = {
columns: [
{ title: '序号', type: 'seq', width: 50 },

View File

@@ -1,10 +1,10 @@
<script lang="ts" setup>
import type { UseVbenVxeGrid, VxeGridProps } from '#/adapter/vxe-table';
import { inject } from 'vue';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button, message } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { getExampleTableApi } from '../mock-api';
interface RowType {
@@ -16,10 +16,6 @@ interface RowType {
releaseDate: string;
}
const useVbenVxeGrid = inject<UseVbenVxeGrid>(
'useVbenVxeGrid',
) as UseVbenVxeGrid;
const gridOptions: VxeGridProps<RowType> = {
columns: [
{ title: '序号', type: 'seq', width: 50 },

View File

@@ -1,10 +1,10 @@
<script lang="ts" setup>
import type { UseVbenVxeGrid, VxeGridProps } from '#/adapter/vxe-table';
import { inject } from 'vue';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { getExampleTableApi } from '../mock-api';
interface RowType {
@@ -16,10 +16,6 @@ interface RowType {
releaseDate: string;
}
const useVbenVxeGrid = inject<UseVbenVxeGrid>(
'useVbenVxeGrid',
) as UseVbenVxeGrid;
const gridOptions: VxeGridProps<RowType> = {
columns: [
{ fixed: 'left', title: '序号', type: 'seq', width: 50 },

View File

@@ -1,11 +1,11 @@
<script lang="ts" setup>
import type { VbenFormProps } from '#/adapter/form';
import type { UseVbenVxeGrid, VxeGridProps } from '#/adapter/vxe-table';
import { inject } from 'vue';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { message } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { getExampleTableApi } from '../mock-api';
interface RowType {
@@ -17,10 +17,6 @@ interface RowType {
releaseDate: string;
}
const useVbenVxeGrid = inject<UseVbenVxeGrid>(
'useVbenVxeGrid',
) as UseVbenVxeGrid;
const formOptions: VbenFormProps = {
// 默认展开
collapsed: false,

View File

@@ -1,11 +1,12 @@
<script lang="ts" setup>
import type { UseVbenVxeGrid, VxeGridProps } from '#/adapter/vxe-table';
import type { DemoTableApi } from '../mock-api';
import { inject } from 'vue';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button } from 'ant-design-vue';
import { type DemoTableApi } from '../mock-api';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { MOCK_API_DATA } from '../table-data';
interface RowType {
@@ -17,10 +18,6 @@ interface RowType {
releaseDate: string;
}
const useVbenVxeGrid = inject<UseVbenVxeGrid>(
'useVbenVxeGrid',
) as UseVbenVxeGrid;
// 数据实例
// const MOCK_TREE_TABLE_DATA = [
// {

View File

@@ -1,10 +1,10 @@
<script lang="ts" setup>
import type { UseVbenVxeGrid, VxeGridProps } from '#/adapter/vxe-table';
import { inject } from 'vue';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { Button } from 'ant-design-vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { MOCK_TREE_TABLE_DATA } from '../table-data';
interface RowType {
@@ -16,10 +16,6 @@ interface RowType {
type: string;
}
const useVbenVxeGrid = inject<UseVbenVxeGrid>(
'useVbenVxeGrid',
) as UseVbenVxeGrid;
// 数据实例
// const MOCK_TREE_TABLE_DATA = [
// {

View File

@@ -1,7 +1,9 @@
<script lang="ts" setup>
import type { UseVbenVxeGrid, VxeGridProps } from '#/adapter/vxe-table';
import type { VxeGridProps } from '#/adapter/vxe-table';
import { inject, onMounted } from 'vue';
import { onMounted } from 'vue';
import { useVbenVxeGrid } from '#/adapter/vxe-table';
interface RowType {
id: number;
@@ -10,10 +12,6 @@ interface RowType {
sex: string;
}
const useVbenVxeGrid = inject<UseVbenVxeGrid>(
'useVbenVxeGrid',
) as UseVbenVxeGrid;
const gridOptions: VxeGridProps<RowType> = {
columns: [
{ type: 'seq', width: 70 },