TypeScript
React で ルーティングをする為のライブラリでデファクトスタンダードとなっているのが react-router です。 そして、Web 上で利用できるように DOM にバインディングができるライブラリが react-router-domです。 reacttraining.com github.com ちなみに、r…
Presentational Component(コンポーネント) と Container Component(コンテナー) Presentational Component(コンポーネント) Container Component(コンテナー) カウンターコンポーネントを Presentational Component(コンポーネント) と Container Component…
Qiitaへ「TypeScript の baseUrl について調べた事」を投稿しました。 qiita.com
Qiitaへ「React + TypeScript で react-router の URLパラメーターを取得する」という記事を投稿しました。 qiita.com
TypeScript(TSX)中でsetIntervalを行うと「Type 'Timer' is not assignable to type 'number'.」とエラーが出た。 ブラウザ環境下で実行する場合は、window.setInterval()と書いて、戻り値を: numberにする事で解決する github.com
タイトルのまま。 「React + TypeScript で State をもつ class コンポーネントを作成するときは、Generics の第二引数に State の型を指定する」 import React, {Component} from "react"; type AppState = { count: number } class App extends Component<…
Storybook + React(TypeScript) の環境で「@storybook/addon-info」と「react-docgen-typescript-loader」を使用して、コンポーネントが受け取るpropsの情報をドキュメントとして生成する事ができるが、特定のコンポーネントでのみ propTables が生成できな…
TypeScriptでは、型が定義されているオブジェクトに追加でプロパティを追加するとエラーが発生します。 type Data = { id: number, name: 'hoge' } const data01: Data = { id: 1, name: 'hoge', created_at: new Date() // Error } この場合は、インデック…
TypeScriptでオブジェクトのプロティをUnion Typesとして設定するには、アサーションを使用します。 // obj: {bar: 1 | 2 | 3, foo: boolean, baz: string} const obj = { foo: false, bar: 1 as (1 | 2 | 3), baz: '2' } これで、obj.barは、数値の1, 2, 3 …
Visual Studio Code には、 TypeScrpt を書いている時に変数などにマウスオーバをした時に型推論が表示される機能があります。 これがすごく便利なのですが、私の好きな WebStorm で同等の機能を再現したく調べた所、設定を一箇所変更する事で同様の機能を使…
配列のような感じだけど、別物。 JavaScriptなら一括に配列として扱われている let data1: [string, number] = ['taro', 20]; // これはオッケー let data2: [string, number] = [20, 'taro']; // これはエラー let data3: [string, number] = ['taro', 20, …
定義する方法が2種類ある。 let array1: number[] = [1, 2, 3]; // リテラル表現 let array2: Array<number> = [1, 2, 3]; // ジェネリクス表現 気をつけたいのが、JavaScriptだと配列の中にどんな型の値でも入れる事ができたけど、TypeScriptだと違う。 アノテーシ</number>…
TypeScriptでは、関数の引数や戻り値にアノテーションという型注釈を付与する事ができる。 これによって、JavaScript特有の暗黙的型変換によるバグなどを防ぐ事ができる。 アノテーションは、: 型の種類というようにコロンに続いて型の種類を指定する。 cons…