How to send data from Builder io blocks and a parent component?

[blaise.t]

What are you trying to accomplish
I wanted to emit events from a Tab Custom Component that can be captured by the parent component to update the parent’s component state.

Code stack you are integrating Builder with
Vue in Astro

Reproducible code example

  <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 gap-16 md:px-[30px] lg:px-[60px] align-top transition-colors duration-500" :style="`background:${(sectionItems??[])[id]?.backgroundColor}`">
    <section class="h-full relative">
      <template v-for="(item, index) in sectionItems" :key="item">
        <div class="h-[100dvh] flex items-center" data-parallel-scroll :data-parallel-scroll-id="index">
          <div class="w-full max-w-xl mx-auto">
            <blocks
              :path="`component.options.sectionItems.${index}.content`"
              :parent="props.builderBlock.id"
              :blocks="item.content"
              // Can I put a call back here ? Like
              @tabChange="Do something"
              
            />
          </div>
        </div>
      </template>
    </section>
  </div>

[alexander]

Hi Blaise,

Vue has an $emit method built in that should be able to accomplish this sort of thing. You could set up an emit event on the child component and listen to it on the parent component. More information can be found here: Vue $emit() Method