Question

我对计算嵌套属性的模态组件有问题。

我有一个父组件调用＆＃34;模态组件＆＃34;通过道具传递数据我传递给我的组件的对象是这样的：

modalProposal:{
  name:test,
  old: { name: oldTest }
}

所以我将我的对象传递给我的组件：

<modal :modal-proposal="modalProposal"></modal>

所以我的组件模式应该有：

export default {
        props:["modalProposal"],
        data() {
            return {
            }

        },
        computed:{
            proposal(){
                return this.modalProposal;
            }
        }
    }

modalProposal 由v-for中的组件父项的函数设置，如：

<button class="btn btn-primary" id="show-modal" v-on:click="openModal(proposal)">see proposal</button>

function openModal：

openModal(proposal){
                this.modalProposal = proposal;
                $('#proposalModal').modal('show');
            }

现在我的问题是，在模板中，如果我写 proposal.name 它可以工作，但如果我写 proposal.old.name 它会返回错误

＆＃34; TypeError：无法读取属性＆＃39; name＆＃39;未定义＆＃34;

如何访问传递给proposal的嵌套属性？

Answer 1

如果，随时，modalProposal.old为undefined，则代码proposal.old.name将引发错误。通常情况下，这是通过使用警卫解决的，或者只是在proposal.old.name有值之前不尝试访问proposal.old。

以下是一名警卫的例子。

proposal.old && proposal.old.name

计算嵌套属性Vuejs

1 个答案: