vuejs父组件如何向子组件传值？

Question

如题，我有一个List.vue，里面包含了两个子组件，tab和pagination，这个List.vue的数据是从接口得来的，从接口的来的数据分别是categories, tabs, active，它们三个都是对象，我现在需要在子组件Tab.vue中使用这个tabs对象，应该如何将这个对象传递给子组件呢？

List.vue

.

Tab.vue

在这里我已经使用了props，这样就可以直接使用tabs了吗？好像不行，求各位大神解答。

<template>

    <div class="col-lg-12 gap-bottom">

        <ul v-for="tab in tabs" class="nav nav-tabs">

            <li role="presentation"><a href="#!{{ tab.url }}">{{ tab.name }}</a></li>

        </ul>

    </div>

</template>

<script>

    export default {

        props: [

            'tabs',

            'active'

        ],

        ready() {

            console.log('tab ready');

            console.log(this.$data);

            console.log(this.tabs);

        }

    }

</script>

Answer 1

给子组件传递数据的方式不太对吧，如果想给子组件传递数据，需要使用v-bind动态绑定到子组件上，所以<pagination&nbsp;:tabs="tabs"></pagination>这样你在子组件的props中写tabs才可以