Mastering React Functional Components with Recompose
Disclaimer: this is not an introduction to React, and some familiarity with React is required. For an introduction to React, check my other article: React.js: a better introduction to the most powerful UI library ever created. Over the years I came to a realization that the only proper way to develop high-quality React applications is by writing stateless functional components. In this article, I
Reactでスクロール位置を表示してみる - Qiita
はじめに スクロール位置をとって表示するみたいなことをしようと思ったときに、ググっても出てくるのがjQueryの情報ばかりで困ったので、Reactでやってみました。 何を作るか 縦にスクロールしたときに、縦位置がなんなのかを表示するコンポーネントを書いてみます。 できあがるのは↓こんなやつです。 作ってみる 基本的な方針は、コンポーネントの状態としてスクロール量を保持し、状態をupdateするための関数をコンポーネントのマウント時にEventLilstenerとして登録するみたいな感じです。順番にコードを追加していきます。 まずはコンポーネントを作ってみる なにはともあれ、ステートレスなコンポーネントを作ってみます。 import * as React from 'react'; type Props = { scroll: number; }; const component: Reac
TypeScriptでrecomposeを使う - Qiita
はじめに 普段はReact.SFCで書いてるけど、ステート追加したり、ライフサイクル追加したりしたいことがあります。 recomposeつかえばいいのですが、型定義が結構深くて調べるのが大変でした。調べる度に追記していきます。 Samples 実際に使ったやつとか組み合わせとかをのせます。 lifecycle 一番簡単なやつです。componentDidMountで統計情報送ったりしたいとき便利です。 import * as React from 'react'; import { lifecycle, ReactLifeCycleFunctions, } from 'recompose'; type Props = { text: string; }; const component: React.SFC<Props> = (props: Props) => { return <div>
recompose と ReactRedux.connect の HOC を Flow で合成して型付けする - Qiita
flow@60.1 これらの型定義の導入を前提とする https://github.com/acdlite/recompose/blob/master/types/flow-typed/recompose_v0.24.x/flow_v0.55.x-/recompose_v0.24.x.js https://github.com/flowtype/flow-typed/blob/master/definitions/npm/redux_v3.x.x/flow_v0.55.x-/redux_v3.x.x.js ユーティリティタイプや段階的な推論を組み合わせるテクニカルなコードになったが、一度理解してしまえば型付けされた props が手に入る。 /* @flow */ import React from 'react' import { bindActionCreators, combineR
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Using recompose to achieve better separation of concerns in React applications
