vue3+ jsx通过slots.default()获取到子节点，如何给子节点default插槽添加自定义内容

要给子节点的default插槽添加自定义内容，可以使用Vue的render函数和JSX语法来实现。

首先，可以在父组件的render函数中通过slots.default()获取子节点，然后在子节点前后添加自定义内容，再将它们一起渲染出来。例如：

import { defineComponent } from 'vue'

export default defineComponent({
  render() {
    const children = this.$slots.default()
    return (
      <div>
        <p>这是添加的前置内容</p>
        {children}
        <p>这是添加的后置内容</p>
      </div>
    )
  }
})

在这个例子中，我们先通过this.$slots.default()获取到子节点，然后在它们前后添加了一个p标签的内容，最后一起渲染出来。

当然，如果想要更加灵活地添加自定义内容，还可以把它们封装成函数或组件，然后在render函数中调用。例如：

import { defineComponent } from 'vue'

export default defineComponent({
  methods: {
    renderCustomContent() {
      return (
        <div>
          <p>这是自定义的内容</p>
        </div>
      )
    }
  },
  render() {
    const children = this.$slots.default()
    return (
      <div>
        {this.renderCustomContent()}
        {children}
        {this.renderCustomContent()}
      </div>
    )
  }
})

在这个例子中，我们把自定义的内容封装在了renderCustomContent方法中，然后在render函数中调用它们。这样就可以灵活地添加自定义内容了。