React.js Excelライクなページを作成ができるreact-handsontableの使い方

React.js Excelライクなページを作成ができるreact-handsontableの使い方

ReactでExcelライクなページが作成できるreact-handsontableの利用手順のサンプルコードです。

環境

  • OS  CentOS Linux release 8.0.1905 (Core)
  • node V10.16.3
  • npm 6.9.0
  • React 16.12.0

react-handsontableインストール

react-handsontableを下記のコマンドでインストールします。

react-handsontable使い方

App.jsを下記のソースコードに編集します。

CSSはCDN版を利用をします。public配下のindex.htmlに下記のコードを追加します。

npm start で起動して、ブラウザから http://プライベートIP:3000 にアクセスすると react-handsontableによりExcelライクなテーブルが作成されます。