0

I have a problem with vue-konva, I can't create too many shapes in the same layer for example :

<template>
    <v-stage :config = "stage">
        <v-layer>
            <v-circle :config = "circle1"
            />
        </v-layer>
        <v-layer>
            <v-circle :config = "circle2"
            />
        </v-layer>
    </v-stage>
</template>

in the result i got the first shape and errors :

vue.common.dev.js:630 [Vue warn]: Error in mounted hook: "TypeError: parentKonvaNode.add is not a function"
found in
---> <VArrow>
       <VCircle>... (1 recursive calls)
         <VLayer>
           <Edge>
             <VStage>
               <Anonymous>
                 <Root>

2 Answers2

0

There is no layer component in vue-konva. You have to use v-layer:

<v-stage :config = "stage">
        <v-layer>
            <v-circle :config = "{radius: 10, fill: 'blue'}"/>
        </v-layer>
        <v-layer>
            <v-circle :config = "{radius: 10, fill: 'blue'}"/>
        </v-layer>
</v-stage>
lavrton
  • 18,973
  • 4
  • 30
  • 63
  • it was a mistake when i rewrote it here, sorry. I used v-layer and it didn't get the expected result it only shows the first shape and get errors – Kaoutar Assania Apr 28 '20 at 11:24
  • Can you make a demo? I tried this and it works https://codesandbox.io/s/vue-konva-many-layers-5prkq – lavrton Apr 28 '20 at 15:15
  • in sandbox it's working fine, but in VScode i get errors. this is the demo: https://codesandbox.io/s/vue-konva-many-layers-0z12u?file=/src/App.vue when i tried debugging, i found that tags should be closed like this : .... not like this : – Kaoutar Assania Apr 28 '20 at 18:08
0

yes my bad it was v-layer it was a mistake when i rewrote it here, sorry. I used v-layer and it didn't get the expected result it only shows the first shape and get errors.