a引用b组件,b又引用了a组件
1.
beforeCreate() {
this.$options.components.bonusSettlementSecondStep = () => import('./bonusSettlementSecondStep')
},
components: {
// BonusSettlementFirstStep与BonusSettlementSecondStep循环引用,需异步导入
bonusSettlementSecondStep: () => import('./bonusSettlementSecondStep')
},
方法1和方法2要注意,和递归的使用要求一样,在引用的子组件上加上一个存在false情况的限制条件,否则两个组件会无限循环,导致“Maximum call stack size exceeded”的错误。如此处的renderStep2默认false,在a组件打开b组件时将其设为true
<bonus-settlement-second-step v-if="renderStep2" ref="bonusSettlementSecondStep" />
// 下一步
handleNextStep() {
this.renderStep2 = true
this.visible = false
setTimeout(() => {
this.$refs.bonusSettlementSecondStep.init()
}, 250)
},