在一般情況下,Vue的數據和頁面的綁定使用v-model就可以了,但是在父子組件中會遇到一些問題。
描述:
初始狀態:['1','2','3']
點擊2的刪除後,頁面顯示['1','2'],然而此時數據爲['1','3']
解決方案:
使用v-if實現手動掛載
template:
<Question v-if="resetflag" v-for="(item,index) in questionList"
:key="index"
@clickDelete="deleteitem(index)"
></Question>
script:
data: function () {
return {
questionList: [],
resetflag:true
}
},
methods:{
reload(){
this.resetflag=false
this.$nextTick(()=>{
this.resetflag=true
})
},
deleteitem(index){
this.questionList.splice(index,1)
for(let i=index; i<this.questionList.length; i++){
this.questionList[i].questionIndex--;
}
this.reload()
}
}