模態(tài)框出現(xiàn)bug,只怪太相信自己福压,在最不應(yīng)該出問(wèn)題的地方出現(xiàn)了問(wèn)題掏秩。
bug:模態(tài)框關(guān)閉時(shí),沒(méi)有做好雙向綁定荆姆。
解決方案:類似于ngModel的做法蒙幻。父子和子父組件通信結(jié)合。
此組件時(shí)自定義組件胆筒,想了差不多一個(gè)上午邮破,經(jīng)歷了一上午才解決。首先,父組件要傳遞給子組件屬性值抒和,這個(gè)用屬性綁定就可队询。代碼如圖:
實(shí)際傳入的時(shí)opened屬性,父組件中只需要定義一個(gè)變量來(lái)傳遞值即可构诚。
而從子組件向父組件傳遞值的時(shí)候蚌斩,需要怎么辦呢?肯定用到了@Output監(jiān)聽(tīng)事件的功能范嘱。這個(gè)功能就可以改變父組件中相應(yīng)的變量送膳。代碼如圖:
可以看到,openedChange方法就是對(duì)應(yīng)的監(jiān)聽(tīng)事件丑蛤。在這個(gè)事件里面叠聋,當(dāng)點(diǎn)擊按鈕時(shí),實(shí)質(zhì)是先讓opened變?yōu)閒alse受裹,然后由子組件emit給父組件的屬性碌补,這樣以來(lái),雙向綁定完畢棉饶。
有坑請(qǐng)看:此處最后的自定義組件是這樣的:
可以看到厦章,opened是進(jìn)行了雙向綁定,一定要記住照藻,emit的事件名稱一定是屬性名+Change,不然無(wú)效袜啃!