天天看點

使用ReactJS實作表格的建立和資料的簡單排序

最近在學習ReactJS的基本使用,想嘗試着做個小東西,加深熟悉。是以就做了個基本的表格,做了個基本的排序功能

JSX的基本使用(JSX确實友善)

React的基本知識:基本控件、事件處理、資料更新。

子類和父類的通信,由于我把表頭和表體分開了,然後通過一個大的Table類,包含了這兩個控件。是以當子類觸發了事件之後,不能夠直接去控制更新它兄弟控件的資料,是以需要通過父控件來做中轉。

建立了三個類分别是Thead(用于實作表頭)、Tbody(用于實作表體)、Table(包含前兩個,共同組成表格)。

在Thead中綁定點選事件,當觸發之後調用,父類的方法。然後通過父類更新Tbody中的資料。

這裡沒有為Table綁定點選事件,是因為我試了試,沒有能夠觸發(功力不夠)。是以放棄了。