Props Function 和 Emits 的差异

[Irisloverain]

各位大神好
我在写一个递归Table（一个Table里可以能有子Table，其子Table里还可能有一个子Table）
遇上了emits只能向上传一层的问题，
改用Props的写法却成功了

想请问者两者写法本质上有何差异呢？

Props写法：

Emits写法：

[Alfred-Skyblue]

You need to trigger the emit of the parent component in the emit function to pass it up recursively. The props can be passed successfully because you pass the props of the parent component to the child component.

<template>
  <div>
    <Table @handle-click="handleClick">
      <!-- ... -->
    </Table>
  </div>
</template>

<script lang="ts" setup>
const emits = defineEmits(['handle-click'])

function handleClick(value: unknown) {
  // ...
  emits('handle-click', value)
}
</script>

[Irisloverain]

Thank you so much!
May I ask what is the difference between emitting and passing function as props ?

[Shyam-Chen]

The usage differs because you designed it differently. I designed a Tree using recursion, and both approaches are applicable. But I suggest using an event listener.

[Irisloverain]

I see! thank you very much.