如果值为 null，则 React-intl 省略指定的文本

Question

如何有条件地删除消息中的周围文本和空格（或不包括在内）？让我们使用文档中的示例。

<FormattedMessage
  id="app.greeting"
  description="Greeting to welcome the user to the app"
  defaultMessage="Hello, {name}!"
  values={{
    name: 'Eric',
  }}  
/>

如果您想获得一个只是说“你好！”的版本，因为用户忘记填写姓名。你会在语言文件中定义一条新消息吗？然后评估名称变量是否为空/未定义？我花了几个小时试图找到解决此问题的方法，但无济于事。

在我的情况下，我有大约 3 个变量被注入，并且所有这些变量都可以是未定义的，因为用户逐步填写数据。它只需要稍微不同的格式，具体取决于哪些已定义，哪些未定义。必须评估所有组合，然后在 lang 文件中定义它们，这似乎是一件非常头疼的事情。

Answer 1

是的，“直接”的方法是有单独的文本。

“你好！”是不同于“Hello, Eric!”的文本。

另外，想象一下在其他一些语言中，甚至可能有不同的词来表示“你好……”后面跟着一个名字，以及一个没有名字的独立“你好”。

你可以提取例如一个<Greeting /> 组件，包括条件，或者在这种情况下使用imperative API intl.formatMessage 可能更容易，同样可能分隔代码的某些部分。