React的props與state(下) states 是元件內部狀態State只能在 Class中使用。State的資料結構就是一個物件JavaScript...
一、事件觸發 JSX與HTML中的語法比較:1.事件觸發在Html的寫法是全部小寫在JSX中是採用駝峰式命名法2.呼叫函式由"action()&quo...
React的props與state(上) props 的資料結構就是一個物件JavaScript Object,就像是var props={name:'jack...
React中自行定義新的Component組件: 一個React Component除了有重要的替換render()外,將會有屬性(props)跟狀態(stat...
DOM就像下面的程式碼,DOM就是html、head、body、div、tr、td之類的。 <!doctype html> <html lan...
JSX 1.JSX語法是React.createElement的簡寫語法,要使用它需要匯入(import)react函式庫,並且要透過babel工具編譯才可以。...
React 的 export default和export明明是兩兄弟,但卻不一樣。 export default一個js只有一個回傳值,用export def...
三種React Componemt元件,通通都可以使用,但有一些微妙的不同 以下這三個元件的功能是相類似的。以class 建立的元件1.需要繼承React.Co...
挑戰 React 第二十二篇 上篇講到生命週期主要分成以下四大類: Mounting Updating Unmounting Error Handling...
挑戰 React 第二十一篇 主要分成以下四大類: Mounting Updating Unmounting Error Handling Mounting...
簡介 axios 是一個基於 Promise 的 HTTP 客戶端,專門服務於瀏覽器和 node.js 。 功能 在瀏覽器中傳送 XMLHttpRequest...
React Toastify彈出組件 簡介 使用React-Toastify來達成簡易的彈出效果。 Step 1: Installation npm insta...
挑戰 React 第二十篇 上一篇提到,若要渲染清單少了 key 會出現以下截圖提示訊息。 加入 unique key,即可解決上面截圖的問題。 const...
挑戰 React 第十九篇 畫面顯示目標 製作一個藥局清單。 Map() function map() 方法會建立一個新的陣列,其內容為原陣列的每一個元素經...
前言 上一篇已經完成了圈圈叉叉的遊戲,現在要加入"回到上一步"的功能。 上一篇的程式中使用了slice()這個方法來複製squares,其...
挑戰 React 第十八篇 新年快樂!!這是今年的第一篇,之後大概是一週新增一篇文章的節奏。 目標 若 isLogin 狀態為登入,頁面顯示歡迎使用者 Tom;...
挑戰 React 第十七篇 在 React 第十一篇了解透過 element 傳遞 props,此篇要介紹要寫傳父組件裡的方法給子組件。 目標 子組件按了按鈕...
挑戰 React 第十六篇 上篇講解找不到綁定的this,因此 setState 才會 undefined,此篇會講解如何解決上述狀況的四種方式。 目標 按了按...
挑戰 React 第十五篇 javascript 與 jsx 事件處理差別 Javascript Jsx 寫法 小寫 onclick 小駝峰 o...
挑戰 React 第十四篇 上篇我們了解 setState 為非同步,而此篇將會舉一個setState踩雷的例子並且告訴大家如何改進。 預先理解準備 上篇程式碼...
挑戰 React 第十三篇 上篇我們了解 state 可以在 component 裡改變資訊且實作。 此篇將會用實作範例,證明修改 component...
挑戰 React 第十二篇 什麼是 React state? 我們上篇有提到,可使用 props 渲染我們要的資訊,但props是唯讀的,那萬一我要在 comp...
挑戰 React 第十一篇 什麼是 props 大家還記得我們前幾篇說過 React Component嗎? Component 可為function Comp...
挑戰 React 第十篇 什麼是 Class Component? 與上篇提到的 function Component 的前三點敘述流程幾乎一樣,只是把 fu...
挑戰 React 第九篇 什麼是 Function Component? 上篇文章我們了解Component的概念就是UI的其中一個部分,也可以重複利用。而以官...
挑戰 React 第八篇 目錄 什麼是組件? 如何用組件達成程式碼重複使用? 兩種組件種類 學習心得 什麼是組件? Component,中文...
挑戰 React 第七篇 上篇了解了package.json,此篇會介紹剩下來的檔案與資料夾。 資料夾結構介紹 檔案 用語法糖 create-react-ap...
挑戰 React 第六篇 前情提要:若還沒有嘗試用 create-react-app,建議先去看安裝React 第三篇文章。 資料夾結構介紹 若第一次寫Reac...
挑戰 React 第五篇 實作範例 在了解什麼是jsx前,我們先來看實作範例,以下有兩個index.html檔案的程式碼,差異在於有沒有編譯成瀏覽器看得懂得ja...
挑戰 React 第四篇 講完透過CDN連結的方式載入React的函式庫與Create React App快速安裝,此篇會寫最後一點高手才用的安裝方式 =>...