我不确定如何从中获取值
<FormattedMessage {...messages.placeholderIntlText} />
转换为类似输入的占位符格式:
<input placeholder={<FormattedMessage {...messages.placeholderIntlText} />} />
因为它会在实际占位符中返回[Object].有没有办法得到实际的正确值？
我不确定如何从中获取值
<FormattedMessage {...messages.placeholderIntlText} />
转换为类似输入的占位符格式:
<input placeholder={<FormattedMessage {...messages.placeholderIntlText} />} />
因为它会在实际占位符中返回[Object].有没有办法得到实际的正确值？
react-intl中的<Formatted... />个React组件用于呈现场景，而不是用于占位符、替代文本等.它们呈现HTML，而不是纯文本，这在场景中没有用处.
相反，react-intl为lower level API提供了完全相同的理由.渲染组件本身在后台使用该API将值格式化为HTML.您的场景可能需要使用较低级别的formatMessage(...) API.
您应该使用injectIntl HOC将intl对象注入组件，然后通过API格式化消息.
例子:
import React from 'react';
import { injectIntl, intlShape } from 'react-intl';
const ChildComponent = ({ intl }) => {
const placeholder = intl.formatMessage({id: 'messageId'});
return(
<input placeholder={placeholder} />
);
}
ChildComponent.propTypes = {
intl: intlShape.isRequired
}
export default injectIntl(ChildComponent);
请注意，我在这里使用了一些ES6功能，因此请根据您的设置进行调整.