鐵人檔案
去年挑戰了Vue，今年想多學一個新框架而選擇了React。目前市場所見的職缺幾乎都是以這兩個框架為主，為了讓自己職涯上更多選擇，因此再次挑戰學習框架。
昨天說到了SPA，那今天就開始router筆記之路。 安裝router npm i react-router-dom import Router會使用到的基本...
昨天import的要素我們還剩下一個沒有介紹到，那就是今天的主題BroserRouter。 BroserRouter BroserRouter是包在整個使用到R...
動態路由是什麼呢? 是利用切換url帶的參數改變畫面的內容，最常使用到的地方應該就是資料的詳細頁面，以一般的網拍來說，我們瀏覽的產品列表頁面為/product，...
下方的程式碼可以發現product頁面下有多個分頁，我們可以用巢狀的方式幫product相關的頁面給包起來，讓程式稍微簡化一些。 <Routes>...
繼上一篇介紹到的巢狀路由，今天要筆記的是一個實際路由會遇上的問題。通常產品列表資訊會在每個頁面出現，我們可以將每頁都貼上產品列表連結，但這很不效率，所以我們得把...
建立新的todo資料夾 npm init react-app todolist 用cd方式轉到todolist資料夾下後，執行專案 npm start Ap...
製作完成與未完成樣式 用最簡單的刪除線來做我們的樣式，那第一步就是要給予一個class去做切換。 function ToDo({todo}){ retu...
篩選代辦事項 製作一個filter去篩選出toDoList中有那些事未完成，所以這邊再多製作一個handleFilter。 補充 : 不用…拷貝是因為flter...
建立input 新增一個ToDoForm.js元件，在這邊使用者可以填寫新的代辦事項，透過enter或是click送出資料。 import Reactfrom...
繼昨天的表單，我們要繼續幫他加上功能。 監控送出按鈕 使用者click或enter時，將資料傳到toDoList的陣列中 const handleSubmit=...
