svgvue-konva

Vue Konva, create stages dynamically

Is there a way to create N+1 stages?

The following is how to create one stage.

<v-stage :config="configKonva">
      <v-layer>
        <v-circle
          v-for="(item2, i) in items2"
          :config="item2"
          :key="i"
          :ref="`circle_${i}`"
        ></v-circle>
      </v-layer>
    </v-stage>
Solution

  • The same way as you use loops for <v-circle /> component, you can use it for stages:

    <v-stage :config="stage.config" v-for="(stage) in stages">
      <v-layer>
        <v-circle
          v-for="(item) in stage.items"
          :config="item"
          :key="i"
        ></v-circle>
      </v-layer>
</v-stage>