在解析過 React 的畫面更新的核心觀念以及 setState 進階的細節之後，接下來我們會往下一個大主題邁進 — 有關於 component 的 render 生命週期以及資料流。如我們最一開始前...
About 手風琴是一排垂直堆疊且用戶可以進行操作的標頭， 標頭內容可以包含像是標題，簡短內容，縮圖 可以用來表示其內容。 用戶可以透過標頭控制哪個段落的內容要顯示或是隱藏。 這個元件通常被使用在該...
把元件延遲卸載的行為打包到 custom hook useDelayUnmount 中，而 TransitionEffect 元件本身專注在處理掛載、卸載動畫效果。再見了 ontransitionen...
今天的重點摘錄 安裝： npm install --save styled-components Emmet ：下載 vscode-styled-components 套件 好處 不會有覆蓋問題...
其實前幾天我們已經有稍微介紹過一些Notion的串接套件了(例如Day13的Notion2Sheet)，但Notion提供的自由度是遠遠不至於此的。而要如何發揮出Notion在生活中最大層面的效益呢？...
在前兩篇的章節中，我們已經了解到在 React 開發中 immutable update 的必要性以及基本的操作方法了。然而有趣的是，在我擔任前端面試官多年也面試過不少前端工程師的經驗中，發現有許多對...
1 <component :is="activeComponent" /> 首先先回想一下在 JavaScript 有 if 可以判斷 function 判斷(page...
它為了解決什麼問題而生？ 當一個基於 OOP 開發的遊戲日漸增長時，資料、邏輯和各種實作會分散在各種不同的物件之中，使得程式碼越來越難理解，間接造成維護成本越來越高。 ECS 便是為了解決這種問題而...
在不同的程式語言中使用web component 在PHP、Ruby on Rails這些可以生成網頁的程式語言中，生成網頁這件事簡單來說就是生成html、CSS和Javascript這三種檔案後再回...
React component 有一些特殊的方法，那就是 Lifecycle(生命週期)，它提供了在特定時間點做特定的操作的功能，例如:允許在特定時間點抓取需要的component。可以是在被渲染之前...