javascript - 使用 intl FormattedTime 无法在反应中将时间显示为字符串

Question

我有这个代码：

var message = "The event starts at {1}";
var startTime = <FormattedTime value={new Date(eventData.startDateTime)}/>;
message = message.replace("{1}", startTime);

return (
  <div>
    {message}
    <br/>
    <FormattedTime value={new Date(eventData.startDateTime)}/><br/>
  </div>                    
);

这打印为：

The event starts at [object Object]
5:55 PM

我有一种感觉，这与 javascript 的关系比反应更大，但是......为什么它在一种情况下打印为 [object Object] 而在另一种情况下打印为正确的时间？

有没有办法让我的事件字符串具有正确的时间？

Answer 1

由于问题是由于试图使用什么是 dom 对象作为变量，一种解决方案是在 HTML 中完成整个操作并使用 intl 的 FormattedMessage 进行字符串替换。这只是碰巧起作用，因为我已经在大括号内使用了要替换的字符串。

<FormattedMessage id="message" 
   defaultMessage="The event starts at {1}" 
   values={{ 1: startTime }}
/>

Answer 2

FormattedTime返回一个对象。如果你想返回一个字符串，你必须使用函数formatTime。

你可以通过injectInlt从'react-intl'调用你的组件的函数来获得它。该功能将在this.props.intl.formatTime().

formatTime(Date.now()); // "4:03 PM"