How can I drawing by order

Question

I want to create a drawing project.

But It order by vue code.

<v-stage
      ref="stage"
      :config="stageSize"
      @mousemove="move"
      @touchmove="handleMouseMove"
      @mouseDown="handleMouseDown"
      @touchstart="handleMouseDown"
      @mouseUp="handleMouseUp"
      @touchend="handleMouseUp"
    >
      <v-layer ref="layer">
        <v-image
          :config="{ image: image, draggable: true, centeredScaling: true }"
        />
        <v-image :config="{ image: image2, draggable: true }" />
        <v-rect
          v-for="(rec, recIndex) in recs"
          :key="`recIndex_${recIndex}`"
          :config="{
            x: Math.min(rec.startPointX, rec.startPointX + rec.width),
            y: Math.min(rec.startPointY, rec.startPointY + rec.height),
            width: Math.abs(rec.width),
            height: Math.abs(rec.height),
            fill: 'rgb(0,0,0,0)',
            stroke: 'black',
            strokeWidth: 3,
          }"
        />
        <v-text
          ref="text"
          :config="{
            x: 10,
            y: 10,
            fontSize: 20,
            text: text,
            fill: 'black',
          }"
        />
        <v-line
          v-for="(line, lineIndex) in lines"
          :key="`lineIndex_${lineIndex}`"
          :config="{
            stroke: line.color,
            strokeWidth: line.width,
            globalCompositeOperation: line.globalCompositeOperation,
            lineCap: 'round',
            points: line.points,
          }"
        ></v-line>
      </v-layer>
    </v-stage>

My step is

1. draw red line
2. draw square
3. draw pink line

I want canvas render by drawing order, Is square up than red line I didn't use z-index because that all change z-index but I just want after brush move up

can anyone help me?