元件庫搭建封裝的一些想法

2022-01-13 06:01:13 字數 1542 閱讀 8592

最近一直在進行元件封裝開發,在這兒記錄一下開發心得。

對於element-ui,大家應該都有使用過,而每次開發都需要設定一些預設值,或者多個元件需要進行組合使用...,對於這些每次開發都需要設定一遍,而且每個人的開發風格不同,導致一些本應該有的小功能,沒能體現出來,因而都需要進行處理。

屬性,事件

在二次封裝時,需要借助v-bind="$attrs",v-on="$listeners",inheritattrs: false來進行元件屬性及事件傳遞

tips:

示例:

對於上面的形式應該都有遇見過,這樣每次使用都要如此處理,特別是大型表單,涉及到多個el-select時,寫起來就有些枯燥了,因而進行簡化處理(這個過程也意味著使用時需要知曉規則)

那之後每次使用就會很輕鬆了,對於上面的例子就可以簡單地使用即可,而且el-select原有的屬性和事件都可以繼續使用

若是想進一步處理,可以繼續進行定製處理即可。這裡需要補充一下,對於方法需要額外處理一下。上面的封裝的還不是很完善,方法的focus,blur還不支援(除非自己通過$refs一層層去找),接著進行處理。

至此,my-select正常使用算是差不多了(資料格式需要前後臺統一即可),想要百分百保持與el-select還是有一些困難,但是對於自己負責的相關專案都是完美支援,這樣就可以了。但是對於一些特殊的元件有時還需要看原始碼才知道如何應對。

雙向資料繫結

v-model用起來很舒服,其實本質是v-bind,v-on簡化的語法糖,專案中的使用

例項:

層級

元件層級巢狀未知時,想要獲取父子的事件,需要通過父調子或子調父遞迴查詢,但是這個存在很多不確定性。因而在封裝元件時,推薦使用provide,inject的方式進行處理

例項:

}

由於在打包發布時,發現元件庫偏大,通過vue-cli-service build --report進行檢視,發現很多外掛程式都只是使用了其中一小部分功能,從而導致整個包偏大

gizp

開發的過程中,更多地是考慮如何工程化,如何更好地相容之前的和為未來做擴充套件,這幾塊還要好好努力。依舊記得尤大說過,如何做到解耦及模組化,這個是我所欠缺的,也許已經實現但是不知道如何去描述了。

下一步是對工程化進一步發起奮鬥了。

關於網路協議封裝的一些新想法

最近業餘時間在寫乙個小遊戲。在為客戶端封裝socket層時頭腦一熱,有了一些新的想法,在這裡記錄一下。客戶端使用的是unity3d引擎。而在unity3d中,基礎的socket庫只提供兩種模式,一種是阻塞模式,一種是非同步callback模式。一般都需要基於這兩種模式下進一步封裝,才可以更方便的使用...

最近一些想法

1.it系統的建設中,當前的方 似乎仍舊沒有足夠重視對目標的認識 這造成的結果,以盲人摸象來形容,實際上是太輕了。今天上街看給小孩玩的電動小象形狀會唱歌但不會動的那種汽車,小孩的媽媽說,咱們去騎小象吧,這給了我乙個認識 我們建模的時候甚至在更早的步驟中進行分析和抽象的時候,往往就是這麼做的。即便不是...

談一些想法

睡不著,做夢驚醒。不知不覺,又是乙個6月8號過去了,如果一切正常的話,應該又有一大批的學弟學妹們走下了考場,滿懷憧憬地準備迎接人生的下乙個十字路口。一年前的我,現在應該坐在家裡,想著我報考什麼學校和專業吧。最開始可能想去北京,報考計算機或者機械,或者別的什麼專業。去年填報志願的時候,人工智慧炒的非常...