zoukankan      html  css  js  c++  java
  • [React Intl] Render Content Based on a Number using react-intl FormattedMessage (plural)

    Using the react-intl FormattedMessage component, we’ll learn how to render content conditionally in our messages based on a number provided as a prop.

    You’ll also learn the syntax necessary to render strings using a plural string matcher.

     

    averageRating: 'Average Rating: {avg} ({count, plural, =0 {No reviews Yet!} one {# review} other {# reviews}})',

    Based on the variable 'count', if =0, then show 'no review yet'; if equals to one, then showing '1 review', if more than one, then showing ''# reveiws", "#" will be replaced by the actual number.

        const avgRating = book.reviews.length ? round(meanBy(book.reviews, (r) => r.rating), 2): 0;
    
          <h3>
            <FormattedMessage id="detail.averageRating" values={{
              avg: avgRating,
              count: book.reviews.length
            }} />
          </h3>
  • 相关阅读:
    IOS之UIKit_Day13
    IOS之UIKit_Day12
    IOS之UIKit_Day11
    IOS之UIKit_Day10
    iOS设计模式之工厂模式
    常用操作
    盒子模式
    block循环使用问题
    IOS-sqlite3
    IOS-View用作控制器
  • 原文地址:https://www.cnblogs.com/Answer1215/p/7263523.html
Copyright © 2011-2022 走看看