前言

最近在重構一個復選框組件，原型是select2這個jQuery插件， 有興趣的可以去搜下，封裝的很好，但是并不能滿足業務所有需求，最要命的是jquery插件這種以dom驅動數據的庫，并不能和vue和angular這種數據驅動dom的框架很好的結合，所以我用vue的component重構了一下，走了不少彎路，做的demo分享出來，還請大家指點一二！

download地址：vue_select2(VeVB.COm).rar

效果圖如下，封裝的應該是蠻抽象的了，只需要傳入下拉框選項list，默認選中list，和回調callback三個參數可以了，在這里特別說明下父與子是如何通信的，因為這里走了不少彎路！！

父級往子組件傳遞數據，通過v-bind綁定數據，子組件接收props里的數據，通過watch監聽數據改變。

子組件往父級傳遞數據，通過$dispatch派發，綁定到自定義的selected或inputed事件，再觸發父級的回調。

總結

以上就是這篇文章的全部內容了，希望本文的內容對大家的學習或者工作能帶來一定的幫助，如果有疑問大家可以留言交流，謝謝大家對武林網的支持。