Tencent / tmagic-editor

Other
4.22k stars 714 forks source link

请教下编辑器扩展-定制属性配置这块的问题 #564

Open spierBoy opened 10 months ago

spierBoy commented 10 months ago

我的需求是:点击特定的业务组件,编辑器中右侧属性配置栏增加一个特定的tab分页(不是目前的属性、样式、事件和高级四个) 看了下编辑器扩展这块的文档,没太看明白,不知道该怎么干预propsService.fillConfig来实现自定义,大佬有时间可否讲解下,配合实例更佳,非常感谢!

jia000 commented 10 months ago

https://tencent.github.io/tmagic-editor/docs/guide/editor-expand.html#_1-%E5%AE%9A%E5%88%B6%E5%B1%9E%E6%80%A7%E9%85%8D%E7%BD%AE%E6%A0%8F%E4%B8%AD%E9%A1%B6%E9%83%A8%E7%9A%84%E5%B1%9E%E6%80%A7%E3%80%81%E6%A0%B7%E5%BC%8F%E3%80%81%E4%BA%8B%E4%BB%B6%E3%80%81%E9%AB%98%E7%BA%A7-tab%E5%88%86%E9%A1%B5

jia000 commented 10 months ago
propsService.usePlugin({
  /**
   * result为生成好的默认配置
   * config为组件中定义好的配置
   */
  afterFillConfig(result, config) {
    return config
  }
});
jia000 commented 10 months ago

可以看fillConfig的实现https://github.com/Tencent/tmagic-editor/blob/84cbc745c7a11d0220c6f2a8b415426a1167df59/packages/editor/src/utils/props.ts#L334

就是要在afterFillConfig里重新实现上面这个函数

spierBoy commented 10 months ago

感谢大佬回复,再请教下: 目前我在看文档的教程:DSL解析那个章节的例子,遇到了个这样一个问题:在文档组件库开发那个章节中写了一个Test的组件,我使用这个组件时发现定义的formConfig和initValue没生效,下面是部分代码 在editor-runtime 中定义组件并且全局注册 textCard.vue

import textCard from './src/index.vue';

export { default as config } from './src/formConfig';
export { default as value } from './src/initValue';

export default textCard;

在hello-editor的App.vue中使用,componentGroupList

{
    title: '基础组件',
    items: [
      {
        icon: 'https://vfiles.gtimg.cn/vupload/20220614/9cc3091655207317835.png',
        text: 'HelloWorld',
        type: 'hello-world',
      },
      {
        icon: 'https://vfiles.gtimg.cn/vupload/20220614/9cc3091655207317835.png',
        text: '测试文本',
        type: 'text-card',
      },
    ],
  },

编辑器查看config,发现只有一个text,定义组件时的value和config并未挂载到text-card中,请请教下大佬是啥原因呢,在哪里注入的value和config

jia000 commented 10 months ago

需要配置propsconfigspropsvalues

vxhly commented 8 months ago

这一块,我也挺希望能有多一点的例子,文档有的时候看不懂😂

vxhly commented 8 months ago

@spierBoy 能否给一个联系方式交流一下,因为我也有这个需求