安装

安装 @vxe-ui/plugin-render-antd

npm install @vxe-ui/plugin-render-antd

注意，在 vben-admin 中需要按以下步骤安装：

首先，在 ./pnpm-workspace.yaml 文件的 `catalog` 节点下添加依赖

catalog:
  // ...
  '@vxe-ui/plugin-render-antd': ^4.0.13

其次，还需在 ./apps/web-antd/package.json 中添加依赖

"@ant-design/icons-vue": "catalog:",

最后，运行 pnpm install 安装完成。

配置

import VxeUIPluginRenderAntd from '@vxe-ui/plugin-render-antd';
import '@vxe-ui/plugin-render-antd/dist/style.css';

setupVbenVxeTable({
  configVxeTable: (vxeUI) => {
    // 支持 antdv 组件渲染：还需要在 app 中声明组件，否则会找不到组件
    vxeUI.use(VxeUIPluginRenderAntd, {});
    // ...
  },
  // ...
});

此时，如果在 columns 配置时使用

editRender: { name: 'ATimePicker', props: { valueFormat: 'HH:mm' } },

会提示找不到组件 ATimePicker，还需要在 app 中声明该组件

 app.component('ATimePicker', TimePicker);