Open minzhenyu opened 2 years ago
@wibetter 能麻烦看下吗,我这是用的demo,并且form那段也是从组件api那边copy来的,看了amis下源代码,这个context是不是在vue中不存在导致的,或者是需要对vue组件做处理
方便的话,截图看下你们的demo代码是怎么写的,
son-plugin.jsx: `/**
export class SonPlugin { rendererName = 'son'; $schema = '/schemas/UnkownSchema.json'; name = 'son'; description = '子组件'; tags = ['容器', '自定义']; icon = 'fa fa-file-code-o'; scaffold = { type: 'son', label: 'son', name: 'son' };
previewSchema = { type: 'son', label: 'son', body: '内容' };
panelTitle = '配置';
panelControls = [ { type: 'textarea', name: 'title', label: '卡片title', value: 'amis 是一个低代码前端框架,它使用 JSON 配置来生成页面,可以减少页面开发工作量,极大提升效率。', }, { type: 'text', name: 'backgroundImage', label: '展示图片', value: 'https://search-operate.cdn.bcebos.com/64c279f23794a831f9a8e7a4e0b722dd.jpg', }, { type: 'input-number', name: 'img_count', label: '图片数量', value: 3, }, { type: 'input-number', name: 'comment_count', label: '评论数', value: 2021, }, ]; }
registerAmisEditorPlugin(SonPlugin, { rendererName: 'son', name: 'son', // description: '信息展示卡片', // tags: ['展示', '自定义'], order: 99, // icon: 'fa fa-file-code-o', // panelTitle: '配置' });
export default SonPlugin;`
@wibetter 之前只是注册自定义子组件是成功了,只是在这个基础上使用form 就失败了
我用的yarn安装的,会是版本的原因吗,自动安装了1.8.0的版本,我记得之前是beta版本
amis-widget@^1.3.3: version "1.3.5"
amis@^1.8.0, amis@^1.8.0-beta.2: version "1.8.0"
amis-editor@^4.1.0-beta.2: version "4.1.0-beta.4"
我又试了下https://aisuda.bce.baidu.com/amis/zh-CN/components/form/index
里面的默认模式,报同样的错误,甚至使用page组件都同样的报错,是vue自定义组件不兼容的原因吗
{ "type": "page", "body": { "type": "form", "api": "/amis/api/mock2/form/saveForm", "body": [ { "type": "input-text", "name": "name", "label": "姓名:" }, { "name": "email", "type": "input-email", "label": "邮箱:" } ] } }
@wibetter 看了下amis-widget 下createVue2Component 里constructor 没传context 这个参数, 还是amis里面WithStore.tsx中 addStore需要使用下图标出来的用法
看截图使用上没有问题,刚测试了一下,确实是我们这边的问题,我先定位下问题哈
好的,谢谢,辛苦了
@wibetter 本地项目做了一个下拉vue组件放进vue容器中也存在相同报错,这次是wrapControl.tsx中rootStore.addStore 这个方法, 所以个人觉得是对vue组件封装成react组件的方法存在一定问题 amis-widget 中vueFactory.tsx 应该是要做兼容处理
不一定是amis-widget 中vueFactory.tsx 兼容处理问题,因为涉及到跨技术栈可能还需要amis-editor做对应的调整。等忙完这两天抽空针对性的看下哈,
目前看跨技术栈支持vue容器还有需要进一步完善的地方,可以试下react容器类自定义组件,
好的,感谢,官方对amis-editor有开源计划吗?黑盒实在是麻烦,没法精准定位问题 我这边也准备换方案了,代价太大,时间上等不及
不好意思哈,短期内amis-editor没有开源计划,在低代码方面如果有需求也可以使用我们的爱速搭哈,支持私有化部署,定制化服务。
@minzhenyu amis-editor 从 4.1.0-beta.19 开始已经开源部分源码了:
好的,感谢
主要是为了方便查看amis-editor中预置组件的可视化配置是如何实现的,这样扩展自定义组件的时候也知道如何设置自定义组件的配置项。
恩,至少有参考信息了
json:
scaffold = { type: 'vue-info-card-container', label: 'vue-info-card-container', name: 'vue-info-card-container', body: [ // 容器类字段 { "type": "container", "body": [ { "type": "form", "api": "/amis/api/mock2/form/saveForm", "body": [ { "type": "input-text", "name": "name", "label": "姓名:" }, { "name": "email", "type": "input-email", "label": "邮箱:" } ] }, { "type": "tpl", "tpl": "自定义容器区", "inline": false },{ "type": "son", "label": 'npm-custom-son', "name": 'npm-custom-son', } ] } ] };