xaboy / form-create

:fire::fire::fire: 强大的低代码动态表单组件,通过数据驱动表单渲染,适配移动端,支持可视化设计。提高开发者对表单的开发效率。目前在政务系统、OA系统、ERP系统、电商系统、流程管理等系统中已稳定应用。
https://www.form-create.com/
MIT License
5.99k stars 964 forks source link

vant提示Invalid attempt to spread non-iterable instance #725

Closed dalidaji closed 5 days ago

dalidaji commented 1 week ago

版本号 (version) @form-create/vant@^3.2.0

UI 框架的版本 (UI version) vant@^4.9.4 vue@^3.4.29

package.json如下

{
  "name": "helloform",
  "version": "0.0.0",
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "@form-create/vant": "^3.2.0",
    "vant": "^4.9.4",
    "vue": "^3.4.29"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^5.0.5",
    "vite": "^5.3.1"
  }
}

使用https://www.form-create.com/v3/vant/ 链接里面的范例,运行时,无法显示组件,提示如下

Uncaught TypeError: Invalid attempt to spread non-iterable instance.
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
    at _nonIterableSpread (@form-create_vant.js?v=32e3d9bf:18053:9)
    at _toConsumableArray (@form-create_vant.js?v=32e3d9bf:18031:98)
    at setup9 (@form-create_vant.js?v=32e3d9bf:19738:21)
    at callWithErrorHandling (chunk-G6NZ5OWH.js?v=7a651c68:2291:19)
    at setupStatefulComponent (chunk-G6NZ5OWH.js?v=7a651c68:9922:25)
    at setupComponent (chunk-G6NZ5OWH.js?v=7a651c68:9883:36)
    at mountComponent (chunk-G6NZ5OWH.js?v=7a651c68:7246:7)
    at processComponent (chunk-G6NZ5OWH.js?v=7a651c68:7212:9)
    at patch (chunk-G6NZ5OWH.js?v=7a651c68:6728:11)
    at ReactiveEffect.componentUpdateFn [as fn] (chunk-G6NZ5OWH.js?v=7a651c68:7355:11)
xaboy commented 1 week ago

版本低了, 可能是命令有问题, 通过下面的命令安装解决

npm install @form-create/vant@next
dalidaji commented 1 week ago

版本低了, 可能是命令有问题, 通过下面的命令安装解决

npm install @form-create/vant@next

问题得到了解决。 但范例里面的checkbox不能正常显示,我修改成如下代码,才能正常显示。 https://www.form-create.com/v3/vant/

        // 无法正常显示
        {
            type: 'checkbox',
            field: 'label',
            title: '标签',
            value: [0, 1, 2, 3],
            options: [
                { label: '好用', value: 0 },
                { label: '快速', value: 1 },
                { label: '高效', value: 2 },
                { label: '全能', value: 3 }
            ]
        },
        // 正常显示
        {
            type: 'checkbox',
            title: '多选框',
            field: 'checkbox',
            value: ['1', '2'],
            props: {
                options: [
                    {
                        text: '复选框1',
                        value: '1',
                    },
                    {
                        text: '复选框2',
                        value: '2',
                    },
                ]
            }
        }
xaboy commented 1 week ago

感谢反馈, 文档写错了