Vueify 上的 Vuejs 递归组件

Vuejs recursive component on Vueify

基于 Vuejs 文档示例,我正在尝试做一个简单的树视图组件,我可以在其中显示会计科目表而无需任何交互(不添加,不拖放...非常简单)。

我已经在 FiddleJs 上做了一个例子,但我的例子工作得很好......我不知道为什么我的应用程序不能让它工作!我不知道这是不是一些 Vueify 问题...也许你可以帮助我!

有我的代码:

OzChartTree.vue

<template>

    <ul v-if="model.length">
        <li v-for="m in model" :class="{ 'is-group': m.children }">
            {{ m.name }}
            <ul v-if="m.accounts">
                <li v-for="a in m.accounts">
                    {{ a.name }}
                </li>
            </ul>
            <oz-tree :model="m"></oz-tree>
        </li>
    </ul>

</template>

<script type="text/babel">

    import OzChartTree from './OzChartTree.vue'

    export default {

        components: {
            OzTree: OzChartTree
        },

        props: {
            model: Array,
        }

    }

</script>

我第一次调用树视图组件的地方

<oz-chart-tree :model="chart"></oz-chart-tree>

问题是当我递归调用 ja .vue 文件上的组件时。

如上所述,我收到以下错误:

app.js:23536 [Vue warn]: Unknown custom element: - did you register the component correctly? For recursive components, make sure to provide the "name" option.

但它已正确注册为 OzTree!看不懂!

有人知道吗?

<script type="text/babel">

    import OzChartTree from './OzChartTree.vue'

    export default {
        name: 'oz-tree-chart', // this is what the Warning is talking about.

        components: {
            OzTree: OzChartTree
        },

        props: {
            model: Array,
        }

    }

</script>