component.tsx 758 B

12345678910111213141516171819202122232425262728
  1. import { defineComponent } from "vue";
  2. import { string } from "vue-types";
  3. import { useCompData } from ".";
  4. import { useEditor } from "../../../..";
  5. export const Component = defineComponent({
  6. props: {
  7. compId: string().isRequired,
  8. },
  9. setup(props, { slots }) {
  10. const editor = useEditor();
  11. const { helper } = editor;
  12. const { children, layout } = useCompData(props.compId);
  13. return () => (
  14. <div style={helper.createStyle(layout)}>
  15. <div class="page-editing-content relative">
  16. {slots.Container?.(
  17. children.default.map((compId) => {
  18. const comp = helper.findComp(compId);
  19. return slots.CompItem?.(comp);
  20. })
  21. )}
  22. </div>
  23. </div>
  24. );
  25. },
  26. });