原创 react-jianshu項目總結

一. icon-font的使用: 直接使用 1. 官網挑選字體 -> 打包下載解壓 -> 複製到statics目錄下 2. 引入css樣式 <link rel="stylesheet" href="../../statics/icon

原创 React Hooks

一. why hooks: 在React conference 2018上, React團隊指出了React社區中被廣泛關注的問題: (1) 邏輯複用問題: react中,組件是構建應用的基本組成部分, 爲了組件更好地複用,目前存在

原创 react學習之理解props.children

對於props.children, 官方文檔是這樣解釋的 props.children is available on every component. It contains the content between the ope

原创 react源碼學習(一)從JSX到React element

一. 體驗jsx: https://babeljs.io/repl const App = () => { return <div id="app" key="key">App</div> } //轉化結果 "use stric

原创 Unable to preventDefault inside passive event listener due to target being treated as passive

一.需求: tab導航要求滾動效果 二.問題: iscroll左右滾動不流暢, 網上找了一通,大致有以下三種解決方法 方法一: 爲滾動區域外層div添加下列css樣式 ```css #wrapper { touc

原创 js設計模式:原型模式

##todo

原创 css多欄佈局的多種實現

#todo

原创 js設計模式: 橋接模式

##todo

原创 js設計模式:適配器模式

一.介紹 試想一下生活中的這種場景: 你的電子設備需要的是三角的插口,但是酒店能夠使用三角插口有限,這種情況下, 插口轉換器就派上用場了 在軟件工程中也有類似的場景, 比如當老項目提供的舊接口無法滿足現有的情況,重寫接口又會帶來很大

原创 js設計模式: 工廠模式

一.介紹 工廠模式主要出現在面向對象創建實例的過程中,其本質是爲了更方便生成實例,因此 在遇到使用new時,就要是否要使用工廠模式 二.實現 1.UML類圖 2.代碼實現 class Product { constru

原创 事件代理

概念: JavaScript高級程序設計 (簡稱JS高程) :事件代理 (事件委託) 利用了事件冒泡,只指定一個事件處理程序,就可以管理某一類型的所有事件。 作用: 減少與dom的交互次數,提高代碼性能。 (–代碼性能–) 在Java

原创 js設計模式: 迭代器模式

一.從一個例子開始講起 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>迭代器模式</title> </head> <body> <p>j

原创 設計模式: 重新認識面向對象

從一道面試題講起. 某停車場,分3層,每層100車位 每個車位都能夠監控到車輛的駛入和離開 車輛進入前,顯示每層的空餘車位數量 車輛進入時,攝像頭可識別車牌號和時間 車輛出來時, 出口顯示器顯示車牌號和停車時長 分析 第一點: 顯

原创 js設計模式:觀察者模式

觀察者模式是前端運用場景最多的,在各大類庫以及框架中都能看到它的身影. 一.特點: 發佈&&訂閱 一對N(一對一,一對多) 二.實現 UML類圖 Subject類內部保存了一個其訂閱者的列表同時還有當前狀態:可以通過setSt

原创 vue源碼學習筆記(一): 數據驅動

雖然已經完成了underscore和zepto的源碼學習,但是還是很有必要講講自己對源碼學習的理解:根據"刻意練習"理論, 人的學習過程分爲: “輸入-練習-反饋-修正"四個步驟,而我們的實際工作中,學習方式一般分爲兩種,一種是經驗式