after the iview modal component is removed, click * close in the upper right corner to report an error Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders.. Instead, use a data or computed property based on the prop"s value. Prop being mutated: "faultModalStatus"
<fault-modal
:faultModalStatus="faultModalStatus"
@faultConfirmEvent="faultConfirmEvent"
@faultCancelEvent="faultCancelEvent"
@getFaultModalStatusChange="getFaultModalStatusChange"
>
</fault-modal>
methods:{
//
getFaultModalStatusChange(e){
console.log(e)
if(e === false){
this.faultModalStatus = false;
};
},
//
faultClickEvent(){
this.faultModalStatus = true;
},
//
faultConfirmEvent(){
this.faultModalStatus = false;
},
faultCancelEvent(){
this.faultModalStatus = false;
}
},
<template>
<div>
<Row>
<Col>
<Modal
v-model="faultModalStatus"
title=""
@on-visible-change="getFaultModalStatusChange"
>
<div slot="footer">
<div>
<Button :loading="buttonLoading" type="success" @click="faultConfirmEvent"></Button>
<Button class="cancelButton" @click="faultCancelEvent"></Button>
</div>
</div>
</Modal>
</Col>
</Row>
</div>
< / template >
< script >
export default {
props:{
buttonLoading:{
type:Boolean,
default:false
},
faultModalStatus:{
type:Boolean,
default:false
},
modalEeqName:{
type:String,
},
modalWorkshop:{
type:String,
},
modalProcess:{
type:String,
},
modalRepairPerson:{
type:String,
},
modalFaultClassify:{
type:String,
},
modalDescribe:{
type:String,
},
modalRepairPersonList:{
type:Array
},
modalFaultClassifyList:{
type:Array
}
},
data(){
return {
// faultModalStatus:false
currentIndex:this.faultModalStatus
}
},
methods:{
//
faultConfirmEvent(){
this.$emit("faultConfirmEvent");
},
faultCancelEvent(){
this.$emit("faultConfirmEvent");
},
getFaultModalStatusChange(e){
this.$emit("getFaultModalStatusChange",e);
}
}
}
< / script >
< style >
< / style >