댓글 검색 목록

[Reactjs] React 앱을 국제화합니다.

페이지 정보

작성자 운영자 작성일 19-11-19 22:23 조회 580 댓글 0

이 라이브러리는 React 구성 요소 및 API를 제공하여 복수, 번역 처리를 포함하여 날짜, 숫자 및 문자열의 형식을 지정합니다.


https://github.com/formatjs/react-intl 


import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import {IntlProvider, FormattedMessage} from 'react-intl';

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      name: 'Eric',
      unreadCount: 1000,
    };
  }

  render() {
    const {name, unreadCount} = this.state;

    return (
      <p>
        <FormattedMessage
          id="welcome"
          defaultMessage={`Hello {name}, you have {unreadCount, number} {unreadCount, plural,
                      one {message}
                      other {messages}
                    }`}
          values={{name: <b>{name}</b>, unreadCount}}
        />
      </p>
    );
  }
}

ReactDOM.render(
  <IntlProvider locale="en">
    <App />
  </IntlProvider>,
  document.getElementById('container')
);








댓글목록 0

등록된 댓글이 없습니다.

웹학교 로고

온라인 코딩학교

코리아뉴스 2001 - , All right reserved.