perf: improve the usage documentation of vben-vxe-table (#4829)
* perf: improve the usage documentation of vben-vxe-table
This commit is contained in:
@@ -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 },
|
||||
|
@@ -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,
|
||||
|
@@ -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 },
|
||||
|
@@ -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 },
|
||||
|
@@ -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 },
|
||||
|
@@ -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,
|
||||
|
@@ -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 = [
|
||||
// {
|
||||
|
@@ -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 = [
|
||||
// {
|
||||
|
@@ -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 },
|
||||
|
Reference in New Issue
Block a user