vbenjs / vue-vben-admin

A modern vue admin panel built with Vue3, Shadcn UI, Vite, TypeScript, and Monorepo. It's fast!
https://www.vben.pro
MIT License
25.48k stars 6.93k forks source link

Bug: naive 查询表单渲染异常 #4721

Open RanMaoting opened 1 month ago

RanMaoting commented 1 month ago

Version

Vben Admin V5

Describe the bug?

代码如下

import { NRadioButton } from 'naive-ui';
const [QueryForm] = useVbenForm({
  // 默认展开
  collapsed: false,
  layout: 'horizontal',
  commonConfig: {
    controlClass: 'h-full',
  },
  schema: [
    {
      component: 'RadioGroup',
      defaultValue: 1,
      fieldName: 'remark',
      label: 'remark',
      renderComponentContent: () => {
        return {
          default: () =>
            Array.from({ length: 5 }, (_, index) =>
              h(NRadioButton, { value: index, label: String(index) }),
            ),
        };
      },
    },
  ],
  // 控制表单是否显示折叠按钮
  showCollapseButton: false,
  // 按下回车时是否提交表单
  submitOnEnter: false,
  wrapperClass: 'grid-cols-1 md:grid-cols-4 lg:grid-cols-5',
});

image zheng正常渲染应该是这样的 image 但是实际上渲染是这样的 image

Reproduction

/

System Info

/

Relevant log output

No response

Validations

RanMaoting commented 1 month ago

对比了一下naive官网的代码通过表单渲染出来的group组件似乎少了样式,但是不知道怎么修复 image

RanMaoting commented 1 month ago

自定义渲染的情况下,默认值不会生效 image