Vue組件化開發(fā)思考
一般說到組件，我首先想到的是彈窗，其他就大腦空白了。
因為覺得這個是在項目中最常用的功能，提取出來方便復用的才是組件～
然而我才發(fā)現(xiàn)這個想法是有問題的。
我發(fā)覺可能從意識上把Vue的組件和UI庫的組件（彈窗之類的）混淆了。。。
緣起于最近的一個表單開發(fā)，頁面上有2個是聯(lián)動菜單的選項。
首先想到的是，這個樣式和選擇地址的那個聯(lián)動菜單，完全一樣哈～
（廢話，同一個項目 當然要保持ui風格的相同啊?。?br />
不過差別在于 我這個是 一個1級 一個2級， 地址那個是4級的.
然后我就想著把那個地址的組件引進來用，發(fā)現(xiàn)這是個寫死4級的
這個時候我只想到2種辦法
1，分別改寫成1級選項和2級選項的2個組件（好像比較low）
2，引用4級聯(lián)動組件，改寫成可選1級選項或2級選項（有點麻煩，到時候還要測地址沒被我改壞）
3，重寫一個可以通用無限聯(lián)動菜單（方便可選級的）
最后選了3，自己重新搞了個。
至于為什么沒有整合2，主要考慮到這兩個組件所處的業(yè)務頁面不同邏輯也有些差異：
1獲取列表的邏輯可能不同，是一次性獲取4級還是每次只獲取1級或2級，
這個不確定的話，做成通用組件就都要處理了
2我這個是直接彈選項的，地址那個是跳新頁面再點擊彈選項的
我這個可以父子組件傳遞數(shù)據(jù)，地址那個用了vuex（非父子）
總之就是實現(xiàn)成本和維護成本高，復用價值沒那么高。
相當于2個頁面都各自有一個樣式相同邏輯不同的組件。
這完全是2個組件～
復制其通用樣式部分，在各自內(nèi)部實現(xiàn)其業(yè)務邏輯。
兩個組件放在不同的板塊內(nèi)，相互獨立，方便管理和維護。
這個時候 再結合vue組件化的圖來看 你會清楚
對于組件化開發(fā)
分治（自有業(yè)務邏輯）比復用（相同邏輯） 更為重要！
復雜的業(yè)務邏輯配合vuex更方便實現(xiàn)組件化～
所以我理解組件化的組件是應該泛指是 高內(nèi)聚低耦合（某phper講給我的專業(yè)名詞，不知道放這用對不對哈）的～
相關文章
這篇文章主要介紹了Vue封裝功能組件，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2019-04-04
我們在使用element-ui的時候經(jīng)常會遇到需要修改組件默認樣式,下面這篇文章主要給大家介紹了關于element-ui中樣式覆蓋問題的相關資料,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2023-03-03
在Vue3中實現(xiàn)子組件向父組件傳遞數(shù)據(jù)的代碼示例
Vue3作為目前最熱門的前端框架之一,以其輕量化、易用性及性能優(yōu)勢吸引了大量開發(fā)者,在開發(fā)過程中,不可避免地需要在組件之間傳遞數(shù)據(jù),本文將詳細講解在Vue3中如何實現(xiàn)子組件向父組件傳遞數(shù)據(jù),并通過具體示例代碼使概念更加清晰2024-07-07
Vue2.7是Vue2.x的最終次要版本,下面這篇文章主要給大家介紹了關于vue3.x項目降級到vue2.7的解決方案,文中通過實例代碼介紹的非常詳細,需要的朋友可以參考下2023-03-03
下面小編就為大家分享一篇基于axios封裝fetch方法及調(diào)用實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-02-02
詳解關于element el-button使用$attrs的一個注意要點
這篇文章主要介紹了詳解關于element el-button使用$attrs的一個注意要點,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-11-11
vue.js 實現(xiàn)點擊按鈕動態(tài)添加li的方法
今天小編就為大家分享一篇vue.js 實現(xiàn)點擊按鈕動態(tài)添加li的方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-09-09
這篇文章主要介紹了Vue手寫實現(xiàn)異步更新詳解，文章圍繞主題展開詳細的內(nèi)容介紹，具有一定的參考價值，需要的小伙伴可以參考一下，希望對你的學習有所幫助2022-08-08
這篇文章主要介紹了vue 打包后找不到dist文件夾的解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-05-05
這篇文章主要介紹了解決vue中的無限循環(huán)問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07