如何使用Vue在子组件中使用对象道具？

Question

我有一个名为Card.vue的子组件，在其中我根据父组件中对象的长度制作卡。在子组件中，我想使用从父组件发送的对象内部的数据。我收到未定义“传奇”的错误消息。我该如何解决？

父组件：

<alst-card v-for="(legend, index) in profile.legends.all" :key="index" v-bind="legend"></alst-card>

子组件：

<p class="card-text" style="min-width: 100px">{{ legend.data.kills.value }}</p>

export default {
  props: {
    legend: Object
  }
}

Answer 1

尝试用v-bind:legend="legend"代替v-bind="legend"

左侧的legend是子组件声明的props，右侧的legend是父组件的data /属性。

例如，如果您的孩子声明：

export default {
  props: {
    givemelegend: Object
  }
}

然后在Parent.Vue中，您需要：v-bind:givemelegend="legend"