React Hooks でリストの絞り込み検索と並び替え機能のサンプル

React Hooks でリストの絞り込み検索と並び替え機能のサンプル ReactとHooks機能を使ってリストの絞り込み検索（フィルター）と並び替え（ソート）機能を作成してみます。 投稿日2019年07月23日 更新日2019年07月23日 準備 適当なコンポーネントファイルを作り作成しましょう。 importするのはuseStateとuseMemo import React, { useState, useMemo } from 'react'; export default () => { // ここにコードを追加していきます。 }; 初期データ（initialState） initialStateとして最初に表示されるデータを作成します。 実際のアプリケーションでは必要ないかもしれませんが、今回はサンプルの動きを見るために作成してます。 今回の検索は、テキスト入力でのタイトル検索と

[hujuu]

“<div className="wrap"> <div className="filter-box"> <div className="input-group"> <input type="text" name="title" className="form-input" placeholder="タイトル" value={filterQuery.title || ''} onChange={handleFilter} /> </div> <div className="input-group"> <div className="selectbox"> <select n