reactjs - 使用复杂消息语法复数的格式化消息

Question

我尝试使用 FormattedMesage(React intl) 来使用格式化 API。如何使用复数创建一个格式化的消息？现在：

const outputTimeOutValues = [
        {value:'00:00:01', translationId:'passage.outputTimeOut.oneSecond'},
        {value: '00:00:03', translationId:'passage.outputTimeOut.threeSeconds'},
        {value: '00:00:05', translationId: 'passage.outputTimeOut.fiveSeconds'},
        {value: '00:00:10', translationId: 'passage.outputTimeOut.tenSeconds'},
        {value: '00:00:15', translationId: 'passage.outputTimeOut.fifteenSeconds'},
        {value: '00:00:30', translationId: 'passage.outputTimeOut.thirtySeconds'}]

    const renderMenuItems = values => values.map(({value ,translationId}) =>
        <MenuItem value={value} primaryText={<FormattedMessage id={translationId} />}/>)

期望带有消息语法的东西

const renderMenuItems1 = values => values.map(({minutes, seconds}) =>
    <MenuItem value={`00:${minutes}:${seconds}`} primaryText={<FormattedMessage

        defaultMessage={'Hello {seconds}, you have {minutes, second} one {minute} other {minutes}'}
        values={{seconds, minutes}}
    />}
    />)

预期文本：1 秒、2 秒等。

Answer 1

使用injectIntl​​ 将 intl 类作为道具注入到您的组件中。然后，您可以在将消息作为道具intl.formatMessage()插入组件之前调用该消息。primaryTextMenuItem