react-intelを使うとサイトの多言語化がいいかんじにできます。 ただ、reduxの処理内に書いたテキストを翻訳するためのAPIとかはありません。redux向けに作られたものではないので当然ですよね。 reducerに言語設定を入れる とりあえずredux内で扱えるようにデータを入れましょう。まずはアクションを作ります。 export function updateLanguage(lang = 'ja') { return { type: 'UPDATE_LANG', lang, }; } 続いてreducerを用意します export function lang(state = 'ja', action) { switch (action.type) { case 'UPDATE_LANG': return action.lang; default: return state;
単純なノードとしてなら、``とかそのまま使えばいい。 けど、`title`とか`alt`とか`placeholder`とか属性値およびそれ以外のフックとかでどうすんのってことを調べたメモ。 もちろん、根本に`<IntlProvider />`がある前提は変わらず。 方法1: const React = require('react'); const { FormattedMessage } = require('react-intl'); class Foo extends React.Component { render() { return ( <img alt={<FormattedMessage id="foo" />} ) } } キモいけどできる、キモいけど。 方法2: injectIntl() const React = require('react'); const { i
react-intlを使って React アプリを国際化してみたところ、結構良かったので紹介します。 tl;dr react-intl を使った React アプリの国際化方法 react-intl を component だけではなく、utility function として使う方法 react-intl とは react-intlは、React アプリの国際化を支援するための Component と幾つかの API を提供する、Yahoo 製のライブラリです。 メッセージだけではなく数値(通貨も含む)、日付など幅広く対応しています。 今回は、メッセージの部分に特化して紹介します。 基本的な使いかた 基本的な使い方は、次の 3 ステップです。 国際化する context を設定する 言語設定ファイルを設定する(もし必要であれば) react-intl が提供する Component(Fo
Inspired by punchdrunker.hatenablog.jp おはようございます、lacoです。 早いもので、Kaizen Platformに入社してから1年になります。 これは退職したときの記事です。 lacolaco.hatenablog.com そしてこれが入社後3ヶ月の記事ですね。こんな記事書いてたこと完全に忘れてました。 lacolaco.hatenablog.com 1年間なにやったか AngularJSアプリケーションのチューニング 入社後の初めてのプルリクエストはAngularJSのチューニングで、めっちゃ遅かったドロップダウンリストの描画を7倍くらい速くしました。 その後もしばらく、パフォーマンスに問題がある画面の計測と改修に手を付けていました。 フロントエンド開発チームの体制づくり 僕が入って4人になったフロントエンドチームですが、新規の小規模アプリ開発
I want to read the onClick event value properties. But when I click on it, I see something like this on the console: SyntheticMouseEvent {dispatchConfig: Object, dispatchMarker: ".1.1.0.2.0.0:1", nativeEvent: MouseEvent, type: "click", target My code is working correctly. When I run I can see {column} but can't get it in the onClick event. My Code: var HeaderRows = React.createClass({ handleSort:
I am using create-react-app. I am trying to call an image from my public folder from a file inside my src/components. I am receiving this error message. ./src/components/website_index.js Module not found: You attempted to import ../../public/images/logo/WC-BlackonWhite.jpg which falls outside of the project src/ directory. Relative imports outside of src/ are not supported. You can either move it
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く