# react-intl-basic

# Overview

Internationalize React apps. This library provides React components and an API to format dates, numbers, and strings, including pluralization and handling translations.

format dates 格式化日期
format numbers 格式化数字
format strings 格式化字符串
pluralization 多元化
translations 翻译 Support for 150+ languages
Runs in the browser and Node.js

# Get Started

Docs: https://github.com/formatjs/react-intl/blob/master/docs/Getting-Started.md

Locales A "locale" refers to the lingual and cultural expectations for a region. It is represented using a "locale code" defined in BCP 47.

This code is comprised of several parts separated by hyphens (-). The first part is a short string representing the language. The second, optional, part is a short string representing the region. Additionally, various extensions and variants can be specified.

# Structure of Code

' The actual formatting and presentation of data and translated strings typically takes these steps:

Determine the user's locale, as described in Runtime Environments guide.
Setup one of FormatJS's integrations with the following data: the user's current locale translated strings for that locale optionally, any custom formats
Call the template engine, passing the data that needs formatting.

# Runtime Environments

# API

FormattedMessage

<FormattedMessage
  id="welcome"
  defaultMessage={`Hello {name}, you have {unreadCount, number} {unreadCount}`}
  values={{ name: <b>{name}</b>, unreadCount }}
/>

injectIntl

# Message extraction

babel-plugin-react-intl react-intl-translations-manager

extract-react-intl-messages (opens new window)

https://medium.com/gumgum-tech/react-internationalization-a6e80e3ce056

← React-Redux-Links React DnD →