Emit使い方

parent.vue

<script setup>
import {ref} from 'vue';

const receiveData = ref({ id: '', name: '' });

const handleNode = (node) => {
  receiveData.value = node;
  receiveData.value = node;
  console.log('handleNode', receiveData.value);
}
</script>

<template>
      <!-- @data-sentが子コンポーネントから発火されるとhandleNodeイベントが発火する -->
      <NodeListLightVersion @data-sent="handleNode" />
</template>

child.vue

<script setup>
import { ref, onMounted, defineEmits } from 'vue'
import { getAllNode } from '@/api/node'


// 親コンポーネントにデータを送信する
const emit = defineEmits(['data-sent'])

const nodes = ref([])

/**
 * 親コンポーネントへ送るデータ
 * @param event 
 * @param rowData 
 */
const sendDataToParent = (event, rowData) => {
    const item = rowData.item;
    emit('data-sent', { id: item.id, name: item.name });
}

/**
 * ページが読み込まれた時に実行
 */
onMounted(async () => {
    await fetchNodes();
})
</script>

<template>
    <v-container>
        <v-data-table :items="nodes" density="compact" @click:row="sendDataToParent">

        </v-data-table>
    </v-container>
</template>