3

我有一个使用 React Intl 和 TypeScript 的应用程序。

我想显示一个带有一些信息文本的框，并且我希望它仅在文本实际存在时才显示。

但我做不到

<FormattedMessage id="my.id" />

因为如果my.id没有值，React Intl 将回退到消息 id，即my.id.

所以我试图做的是

const myId: string = 'myId';
const info: string = <FormattedMessage id={myId} />;
const infoExists: boolean = myId === info;

然而，info是JSX.Element，不是string。

有没有办法做这样的事情？

4

2 回答 2

1

我想到了。

const id: string = 'id';
const componentToBeRenderedIfIdHasValue = ...;

<FormattedMessage id={id}>
    {
        (message: string) =>
            message === id
            ? null
            : componentToBeRenderedIfIdHasValue
    }
</FormattedMessage>

我希望这可以对某人有所帮助。

于 2017-07-20T12:13:47.143 回答
1

对于 JS

const stringExists = !!this.props.intl.messages[id];

在这里回答

于 2021-03-15T15:01:00.163 回答