Vue.js отсутствует необходимая опора - PullRequest
Новая
       8

Vue.js отсутствует необходимая опора

0 голосов
/ 11 мая 2018

Я только начинаю с Vue.js, так что, возможно, я упускаю что-то очевидное.Чтобы попрактиковаться, я попытался создать простой компонент treeView (с подкомпонентом treeViewItem).У меня есть только 1 свойство в treeView, которое является списком элементов: items
Вот компонент treeView: 

@Component
export default class treeView extends Vue {
    @Prop({
        required: true
    })
    items!: treeViewItemOptions[];
}

И я инициализировал Vue следующим образом: 

let v = new Vue({
    el: "#app",
    template: `
    <div>
        <tree-view :items="items" />
    </div>
    `,
    data: {
        items: treeViewItems
    }
});

Я получаю эту ошибку: '[Vue warn]: отсутствует необходимая реквизит: "items"

Я использую машинопись с vue-property-decorator
Также я запускаю vue 2.5.16 и vue-property-decorator 6.0.0

Спасибо,

Изменить 1 Я попытался заменить <treeViewItem> на простой <li> в treeView.vue file: 

<template>
    <ul>
        <!-- it works if I replace the following <treeViewItem> for <li> -->
        <treeViewItem v-for="item in items" v-bind:key="item.id" v-bind:item="item"></treeViewItem>
    </ul>
</template>

Я не получил никакой ошибки о пропе 'items', и я даже увидел пару <li>, сгенерированных в html-коде, поэтому items работают, но не тогда, когда яЯ использую мой treeViewItem компонент!

Здесь другой компонент: 

@Component
export default class treeViewItem extends Vue {
    @Prop({
        required: true
    })
    item!: treeViewItemOptions[];    
}

1 Ответ

0 голосов
/ 11 мая 2018

Я обнаружил проблему, субкомпонент импортировал неверный файл ts: 

<script lang="ts">
    import treeViewItem from './treeView';
    export default treeViewItem;
</script>

Вместо 

<script lang="ts">
    import treeViewItem from './treeViewItem';
    export default treeViewItem;
</script>

Черт, копируй вставку!

...