はてなブックマーク

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

2019/11/20 追記 当記事でメインに取り扱っていたライブラリ名が変更されました。Redux Starter Kit -> Redux Toolkit それに合わせて、本記事もアップデートしています。 追記終わり はじめに Redux Hooks がリリースされたおかげで、Redux の store とコンポーネントのつなぎ込みが簡単になりました。 今回は Redux チームが公式にリリースしている Redux Toolkit を利用すると、Action、Reducer 部分もかなり簡潔に記述できるというお話です。 Redux Hooks については以下の記事を参照してください。 Redux Hooks によるラクラク dispatch & states Redux Toolkit とは？ Redux チームが公式にリリースしているReduxを簡潔に記述するためのライブラリです。 ほ

本日 (2019/06/11) React-Redux の version 7.1 がリリースされて、 Redux Hooks が使用できるようになりました。 Redux Hooks によって、connect() を利用しなくても、各コンポーネントとdispatch, state が簡便に利用できるようになります。 サンプルコードです。Action, Reducer 部分は省略です。 ただシンプルにカウンターの数値を増減させるだけのコンポーネントです。 import React from "react"; import { useDispatch, useSelector } from "react-redux"; import { incrementAction, decrementAction } from "./Actions"; const counterSelector = st

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?