Typescript 使用Vue类样式组件的递归组件

我正在使用vue属性装饰插件的类样式组件。 我如何拥有一个递归组件并使用组件本身。 我的代码如下：

<template>
<ul>
    <li>
        <div>
            {{nodeData.someData}}
        </div>
    </li>
    <li>
        <TreeNode
        v-for="item in nodeData.children"
        :key="item.id"
        ></TreeNode>
    </li>
</ul>
</template>

<script lang="ts">

import {Vue, Prop, Component, Watch} from 'vue-property-decorator';

@Component({
//error :'TreeNode' was used before it was defined.
   components:{TreeNode}
})
export default class TreeNode extends Vue {

   @Prop() nodeData?: myType;

}

</script>

{{nodeData.someData}




从“Vue属性装饰器”导入{Vue，Prop，Component，Watch}；
@组成部分({
//错误：“TreeNode”在定义之前已被使用。
组件：{TreeNode}
})
导出默认类TreeNode扩展Vue{
@Prop（）nodeData？：myType；
}

在组件中使用TreeNode选项会导致错误：“TreeNode”在定义之前已被使用。 我怎样才能修好它？或者什么是替代方法？

无需：

components:{TreeNode}

只要把它取下来，一切都会好起来的