javascript - vue: 父組件給子組件傳遞數據，子組件接收到了，但是報錯，怎么解決？

問題描述

點擊每個卡片就可以看到了錯誤信息了

<p v-show='showParagraph' @click='switchInput' > {{currentCardInfo.values[1].value}} <span v-if='currentCardInfo.cardImage'><img :src=’currentCardInfo.cardImage’> </span> </p>

問題解答

請把代碼貼全撒

props里面駝峰寫法的屬性在html里面需要轉換成-分割的屬性，所以edit-panel的currentCardInfo修改如下

<edit-panel ... :current-card-info='cardInfo' ... ></edit-panel>回答3：

{{currentCardInfo.values && currentCardInfo.values[1].value}}回答4：

子組件中使用

props:{ currentCardInfo:Object}

來獲取父組件傳遞的屬性值

由于你{{currentCardInfo.values[1].value}}中，currentCardInfo.values未定義，所以對于未定義的currentCardInfo.values，currentCardInfo.values[1]無法獲取到，所以報這個錯誤，解決方法是：在訪問currentCardInfo.values[1]數據之前先判斷一下currentCardInfo.values是否存在：

{{currentCardInfo.values && currentCardInfo.values[1].value}}

如果currentCardInfo.values不存在，那么，后面的currentCardInfo.values[1].value就不會被運行到。

但是，我建議你把父組件中調用子組件的代碼貼出來，方便進一步給出修改意見。