サクサク読めて、アプリ限定の機能も多数！
トップへ戻る
新内閣発足
log.pocka.io
#やりたいことReact でよくあるパターンとして、親コンポーネントの Props の一部 or 全部を子コンポーネントに渡す、というものがあります。 // Fooが受け取ったbaz以外のpropsをBarに渡す const Foo = ({ baz, ...rest }) => <Bar {...rest} /> // Quxが受け取ったbaz以外のpropsをdivに渡す const Qux = ({ baz, ...rest }) => <div {...rest} /> これを TypeScript で書く、というのがこの記事の目的です。 #コンポーネントに渡す場合extendsまたは Intersection Type を使います。 import { SFC } from 'react' interface FooProps { hoge: string fuga: number
#概要普段プライベート/仕事共に React を書くことが多いのですが、その中で得た知見や経験則といったものを、他の人のコードレビュー時や設計時に上手く伝えられないケースが多々ありました。また、他の人がどういった書き方をしているか、ということを知るのは引き出しの幅を広げたり意外な発見ができたりします。 そのため、これまでの自分の経験を元にした自己流ベストプラクティスを共有したいと思います。 なお、メモ的な役割があったり、感覚的な部分もあるのであまりまとまった文章になっていないです。 これらはあくまでも個人的なベストプラクティスであり全ての開発者/プロジェクトに当てはまるとは限りません。 全て TypeScript 導入を前提としています。 #スタイリング可能なコンポーネント原則全てのコンポーネントがclassNameとstyleを受け取り、最も外側にある要素に受け渡すようにします。これによ
#まえがきこの記事はWebpackを使って単一ファイルコンポーネント(Single File Component)のVueアプリケーションを作るチュートリアルです。 公式の日本語ドキュメントはかなりしっかりしています。 しかし、vue-cliを使わない通常の開発フローに沿ったチュートリアルや、単一ファイルコンポーネントの使い方等、実際に使うにあたって必要な情報がかなり少ないです。 本記事ではその部分のカバーをすることを目的とします。 対象読者は フロントエンド開発の知識がある(JSやCSSのコンパイル等) npmを用いた開発フローをある程度知っている Vue.jsの名前くらいは知っている 最近のJavascriptがある程度書ける くらいの人を想定しています。 #つくるものこのチュートリアルでは、Vue.jsを使ったカウンターアプリを作ります。 JSファイルのビルドにはWebpackを、各
TypeScript には Promise や Symbol といった Javascript 特有のグローバルオブジェクト以外に、型を扱う上で便利になるような組み込みのジェネリックな型関数※1が存在します。これらは非常に便利で様々なプロジェクトで使われているので~すが、公式にリストもなく、説明も主にリリースノート等にしかないため、~使い方等を交えて説明を書いていきたいと思います。 なお、各定義はMicrosoft/TypeScript のsrc/lib/es5.d.tsにあります。 ※1 ... 型を受け取って新しい型を返す型。多分正しい呼び名ではない。 Partial 利用可能バージョン: TypeScript2.1~リリースノート: https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-1.htm
このページを最初にブックマークしてみませんか？
『https://log.pocka.io/』の新着エントリーを見る
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
