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

我有一个父组件,它通过 Prop 调用“模块组件”传递数据。
我传递给我的作曲的对象是这样的:

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>

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

现在我的问题是,在模板中,如果我写 proposal.name ,这是可行的,但是如果我写了 proposal.old.name,,则返回错误



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

最佳答案

如果在任何时候modalProposal.oldundefined,则代码proposal.old.name将引发错误。通常,这可以通过使用防护措施来解决,或者只是在proposal.old.name具有值之前才尝试访问proposal.old

这是一个警卫的例子。

proposal.old && proposal.old.name

关于vue.js - 计算嵌套属性Vuejs,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/45331134/

10-09 14:39