子元件代碼
//子元件請求接口,用自己封裝的axios
getupdate(){
this.$post({
url:this.$apis.unitupdate,
postType:'json'
})
.then( () => {
this.$emit("getlist")//成功之後觸發更新清單
})
},
this.close() //關掉彈窗
父元件代碼
//父元件
//在父元件中插入子元件彈窗 getlist是在子元件觸發的事件
<Dialogedit v-if="showdialog" @getlist="getList"> </Dialogedit>
<script>
//請求清單
method:{
getList(){
this.$get({
url:this.$apis.drugunit,
query:this.params
})
.then( res => {
this.mainList = res.data.list
})
},
}
</script>
這樣做就會出現一個問題 就是在子元件中,this.$emit觸發不了或者延遲
原因是在觸發this.$emit請求傳回需要時間,而在請求過程(因為是異步是以會先執行下面的操作),調用了this.close(this.close是定義好的方法)将彈窗關閉,是以導緻this.$emit不能傳回
隻要把this.close放到then裡面就可以了就是請求成功才關閉視窗
getupdate(){
this.$post({
url:this.$apis.unitupdate,
param:this.formModel,
postType:'json'
})
.then( () => {
this.$emit("getlist")
this.close()
})
這樣就會在關閉視窗前更新清單