diff --git a/src/components/KonvaNode.js b/src/components/KonvaNode.js index aebcbd1..9354ca8 100644 --- a/src/components/KonvaNode.js +++ b/src/components/KonvaNode.js @@ -1,5 +1,6 @@ import { h, + inject, ref, reactive, watch, @@ -39,6 +40,7 @@ export default function (nameNode) { }, setup(props, { attrs, slots, expose }) { + const prefix = inject('prefix'); const instance = getCurrentInstance(); const oldProps = reactive({}); @@ -109,7 +111,7 @@ export default function (nameNode) { const isContainer = CONTAINERS[nameNode]; return isContainer - ? () => h('template', {}, slots.default?.()) + ? () => h(`${prefix}Container`, {}, slots.default?.()) : () => null; }, }; diff --git a/src/index.js b/src/index.js index d479067..28af1ca 100644 --- a/src/index.js +++ b/src/index.js @@ -29,6 +29,7 @@ const KONVA_NODES = [ 'Arrow', 'Shape', 'Transformer', + 'Container', ]; const components = [ { @@ -47,6 +48,7 @@ const VueKonva = { if (options && options.prefix) { prefixToUse = options.prefix; } + app.provide('prefix', prefixToUse); components.forEach((k) => { app.component(`${prefixToUse}${k.name}`, k.component); });