@formily/vue + ant-design-vue 枚举值不显示

[yangshuwei]

{
  type: 'object',
  properties: {
    select: {
      type: 'string',
      title: '选择框',
      'x-decorator': 'FormItem',
      'x-component': 'Select',
      enum: [
        { label: '选项1', value: 1 },
        { label: '选项2', value: 2 },
      ],
      'x-component-props': {
        style: {
          width: 120,
        },
      },
    },
  },
}

[MisicDemone]

你需要使用 @formily/vue 提供的 connect 方法，将 field 实例上的 dataSource 属性"连接"到 Select 组件的 options 属性上。

import { Select as ASelect } from "ant-design-vue";
import { connect, mapProps } from "@formily/vue";

const Select = connect(
  ASelect,
  mapProps({
    dataSource: "options",
  })
);

参考：https://codesandbox.io/s/cocky-cloud-q8xsr?file=/src/App.vue:1355-1437

另外，这个 schema 有一些问题

1. enum中描述的value是数字类型，所以select的type应该是number（虽然不会影响渲染）。
2. x-component-props 中的 style 暂不支持对象写法。