vue3+ jsx，在组件中通过slots.default()获取到默认插槽的内容，如何修改默认插槽里的组件的插槽内容

在Vue3中使用JSX时，如果想要修改默认插槽里的组件的插槽内容，可以使用`cloneVNode`函数来克隆子节点，并在克隆后的子节点上修改插槽内容。具体实现步骤如下：

1. 在父组件中，使用`<slot>`元素来声明默认插槽，并在其中添加需要传递给子组件的内容：

// Parent.vue
<template>
  <Child>
    {{
      default: () => (
        <div>
          <h1>父组件默认插槽</h1>
          <slot />
        </div>
      )
    }}
  </Child>
</template>

2. 在子组件中，使用`$slots`属性来获取父组件传递的插槽内容，并在需要的地方使用`cloneVNode`函数来克隆子节点，并在克隆后的子节点上修改插槽内容：

// Child.vue
<template>
  <div>
    <h1>子组件</h1>
    <div v-slots="{
      default: () => {
        const defaultSlot = $slots.default();
        const clonedSlot = cloneVNode(defaultSlot, {
          default: () => <h2>修改后的插槽内容</h2>
        });
        return clonedSlot;
      }
    }"></div>
  </div>
</template>

这样就可以在子组件中修改父组件默认插槽里的组件的插槽内容了。注意，`v-slots`指令中的对象属性名需要与父组件中的插槽名称保持一致。