乙個專案中，根據自己手頭分配到的頁面，抽出公共的模組或者元件。
下面舉例說明：
列表頁
左邊欄目列表模組，下翻到底可以刷列表，每個欄目對應一組媒資資料，每個欄目第一屏媒資資料做快取，使用者切換欄目的時候，可以即時展現，增強首屏體驗。
右側媒資展示模組，往下可以翻頁，根據盒子效能規劃好每次介面跑的資料量並做好快取，在翻頁達到一定量的時候才跑一次介面（展示loading），增強使用者體驗。
計數模組，抽成元件，可移植到其他專案或者頁面，根據媒資模組傳入的資料顯示。
篩選條件
單行可橫向翻頁，多行可縱向翻頁，橫向翻頁和欄目列表乙個演算法，所以抽出翻頁元件復用。
優化：篩選條件是做在列表頁的，由於dom節點較多，所以在最開始生成後，先移除dom並快取起來，優化盒子的渲染。使用者點選篩選時，在顯示dom。
搜尋頁
搜尋結果分類往右可翻頁，復用欄目列表元件。
媒資模組復用列表頁媒資模組。
計數模組復用列表頁的計數模組。
鍵盤模組做成兩個靈活控制樣式的元件：九宮格和全鍵盤，在其他專案可以移植使用。
搜尋框做成元件，在其他專案也可以使用，包含介面和顯示功能。
我的片單
媒資模組復用列表頁
計數模組復用列表頁的計數模組。
模組都是使用立即執行函式形式返回乙個物件，只暴露少部分api出去和其他模組互動，自身屬性都是定義為區域性變數，不暴露在外，最大限度的在其他專案的相似模組可復用。
元件設計考慮專案更多場景，達到專案間的移植。
欄目列表模組
包含拉取資料方法，渲染方法和其他模組互動的api。
該模組的渲染方法抽離出來，根據資料，公用到篩選和搜尋。
媒資模組
包含拉取資料方法，渲染方法和其他模組互動api。
該模組在篩選，搜尋完全復用，只管介面和資料的更改。
在片單頁面，在渲染部分有一定邏輯更改。
計數模組
樣式和計數方式可自定義，把計數單獨做成元件，劃分得這麼小粒度，是因為覺得它是乙個功能模組，雖然和媒資模組聯絡緊密，但說到底，其實是和計數模組接收到的資料聯絡緊密。
頁面自身內部的模組規劃，一般都是根據業務功能規劃，這樣減少全域性物件，使用立即執行函式形式，控制各自的命名空間，達到解耦和復用的目的。
比如這個搜尋頁面：
鍵盤由兩個物件分別管理：九宮格物件和全鍵盤物件，操控鍵盤的互動行為。
搜尋框物件：接收來自兩個鍵盤物件的資料，呼叫搜尋介面和展示搜尋內容。
媒資列表物件：根據接收到的條件拉取媒資資料，展示和管理媒資部分與使用者的互動行為。
搜尋結果分類物件：獲取到搜尋結果資料展示，管理使用者在這塊區域的互動行為，響應使用者行為傳遞資料給媒資物件，展示對應的媒資資料
計數器物件：接收來自媒資列表物件的資料，進行計數展示。
Angular學習 模組和元件的動態載入
可以利用路由的loadchildren來動態載入angular模組和元件。1.建立乙個要動態載入的模組 包含相應的元件 dyn plugin.module.ts import from angular core import from angular common import from pfc p...
os模組pickle模組和字串的一些內建函式
import os os.curdir 返回當前目錄的路徑 os.getcwd 獲取當前路徑 os.listdir 獲取目錄下所有的檔名和目錄名,將所有的目錄和檔案封裝成列表 os.mkdir 建立乙個目錄,如果目錄存在會報異常,如果該新目錄的父級目錄不存在會報異常 os.makedirs 如果該新...
Vue中模組化和元件的理解
最近接觸vue寫專案，這是對於vue中的兩個關鍵的部分我自身的一些理解。希望能對大家有一定的幫助。當然，其中一些描述，可能不太準確，還請大家多多指出錯誤的地方。我們說vue專案是按照模組進行劃分的，那麼什麼是模組呢？其餘的元件可以通過以下的方式進行注入使用。在使用的時候，將元件的name屬性中的名稱...