How do you pass a parameter to defineMessages in react-intl?

reectrix picture reectrix · May 11, 2018 · Viewed 10.8k times · Source

I have an error message like the one below:

Could not retrieve data: ${e}

How do I convert this to a definedMessage that can accept this error parameter?

A standard definedMessage:

    const messages = defineMessages({
     dataError: {
         id: 'data.error',
         defaultMessage: 'Could not retrieve data: [default message]'
     }
   })

Thanks!

Answer

Tomasz Mularczyk picture Tomasz Mularczyk · May 11, 2018

If I understood you correctly like this:

const messages = defineMessages({
  dataError: {
    id: 'data.error',
    defaultMessage: 'Could not retrieve data: {message}'
  }
})

<FormattedMessage
  {...messages.dataError}
  values={{message: `Could not retrieve data: ${e}`}}
/>