访问子组件中的嵌套道具答案

【问题标题】：Access nested prop in child component访问子组件中的嵌套道具
【发布时间】：2021-12-11 05:40:28
【问题描述】：

我正在像这样将数据传递给子组件：

父.vue

<template>
 <vote-buttons :data="data">
 </vote-buttons>
</template>

props: {
 comment: {type: Object}
},
setup(props) {
 const data = {
  'score': props.comment.score,
  'hasVoteOfUser': props.comment.hasVoteOfUser,
 }

 return { data }
}

Child.vue

props: {
 data: { type: Object }
},

// or

props: {
 data: {
  score: { type: Number },
  hasVoteOfUser: { type: Boolean }
}

当我在子组件中访问{{ data.score }} 时，我得到Uncaught TypeError: $props.data is undefined 并且只是{{ data }} 呈现整个对象{ "score": 1, "hasVoteOfUser": true }。为什么渲染一个属性不起作用？谢谢

【问题讨论】：

标签： vue.js

【解决方案1】：

那是我的错，同一页面上还有另一个组件，它使用了同一个子组件，并且没有提供data 属性。这个问题对我很有用：Uncaught TypeError: $props.currentQuestion is undefined Vue

【讨论】：