zoukankan      html  css  js  c++  java
  • [React Intl] Use a react-intl Higher Order Component to format messages

    In some cases, you might need to pass a string from your intl messages.js file as a prop to a component. Instead of using react-intl components (which generate markup), we’ll use the injectIntl higher order component provided by react-intl. This will provide just the string we’re looking for, make the prop simpler, and avoid creating unnecessary DOM elements.

    We’ll also use props passed to the component from the Higher Order Component to clean up some redundant code.

     

    import React from 'react';
    import { injectIntl, FormattedMessage, FormattedHTMLMessage, FormattedRelative , FormattedTime, FormattedNumber } from 'react-intl';
    import {meanBy, round, sortBy} from 'lodash';
    
    import books from '../books.json';
    
    const BookDetail = ({match, intl}) => {
      
      return (
        <div className="BookDetail">
         ....
          <textarea placeholder={intl.formatMessage({
            id: 'detail.inputPlaceholder'
          })} cols="30" rows="10"></textarea>
        </div>
      )
    }
    
    export default injectIntl(BookDetail);
  • 相关阅读:
    Fluent NHibernate之旅
    IOC之Unity
    使用AutoMapper实现Dto和Model之间自由转换
    javamail邮件发送
    webservice整合spring cxf
    spring 集成mongo配置
    mongodb安装 win7版
    freemarker之list和map
    servlet生命周期
    ArrayList和LinkedList和Vector源码分析
  • 原文地址:https://www.cnblogs.com/Answer1215/p/7265695.html
Copyright © 2011-2022 走看看