iT邦幫忙

鐵人檔案

2021 iThome 鐵人賽
回列表
Modern Web

前端日常,每天 React 一下 系列

以 React 為中心的學習筆記,內容主要包含:
★ React 基礎概念、常見功能、活用知識點
★ React Hook 學習筆記
★ Redux 學習筆記

鐵人鍊成 | 共 30 篇文章 | 5 人訂閱 訂閱系列文 RSS系列文
DAY 11

【Day10】表單 Form:受控元件 Controlled Component

在 React 中,允許直接用 HTML 來建立表單,但使用 JavaScript function處理提交表單、讀取使用者在表單中填入的資料更加常見也更方便。...

2021-09-26 ‧ 由 Emi 分享
DAY 12

【Day11】表單:非受控元件 Uncontrolled Component

受控 vs. 非受控元件 受控元件:value 值由 React component 使用 state 負責處理,隨時監聽內容來改變值 非受控元件:value...

2021-09-27 ‧ 由 Emi 分享
DAY 13

【Day12】插槽 Portals

Portals 是一種讓 children 可以 render 到parent component DOM 樹以外 DOM 節點的方法,適合拿來做彈窗等許多地方...

2021-09-28 ‧ 由 Emi 分享
DAY 14

【Day13】型別檢查 PropTypes

在 React 中,可以使用 React 配套插件propTypes 來檢查型別。 PropTypes 主要功能 定義 component prop 的型別...

2021-09-29 ‧ 由 Emi 分享
DAY 15

【Day14】樣式 Style

CSS in React 以下紀錄在 React 中撰寫 CSS 的幾種方法。 內聯樣式/行內樣式(inline style) style 屬性內容除了傳統...

2021-09-30 ‧ 由 Emi 分享
DAY 16

【Day15】代碼分割 & 延遲載入 Code Splitting & Lazy loading

打包 Bundle bundle 的英文原意是指將東西捆成一綑,而在程式用語中所謂的 bundle 即是將被 import 的檔案合併成一個單一的檔案,再將這個...

2021-10-01 ‧ 由 Emi 分享
DAY 17

【Day16】React Router

一頁式網站 SPA SPA 全名 Single Page Applications只有一個 HTML 檔,其他都是框架編譯出來的更改路徑時實際上是改變頁面中不一...

2021-10-02 ‧ 由 Emi 分享
DAY 18

【React Hook 01】概述

Hook 是 React 16.8 中增加的新功能,補足了早期 Function Component 屬於纯函数無法使用 lifecycle、state 方法的...

2021-10-03 ‧ 由 Emi 分享
DAY 19

【React Hook 02】useState

useState 顧名思義,在 function component 中,其功能相當於 State,用以管理元件內部私有的狀態資料 useState 的使用方式...

2021-10-04 ‧ 由 Emi 分享
DAY 20

【React Hook 03】useEffect

useEffect 的 Effect 意指「副作用」,即是指 fetch 資料、訂閱事件與改變 DOM,這些在 render 期間無法完成,卻又會影響其他 co...

2021-10-05 ‧ 由 Emi 分享