How can I use translations in a component title?

Question

I'm using react-translate-redux in a project for internationalization, but I don't know how to use translations in a component's properties. Specifically, I would like the title text of a component to be internationalized.

I would try the below,

<Button title={<Translate id="button">}>

but Type 'Element' is not assignable to type 'string'.

How can I internationalize the title text?

Did you read e.g. https://ryandrewjohnson.github.io/react-localize-redux/getting-started/? The Translate component isn't your only option. — jonrsharpe, Jun 20 '19 at 21:57

score 0 · Accepted Answer · answered Jun 21 '19 at 07:20

If you want to use Translate Component you can't pass it as a prop, you have to pass it as a child component and render it with this.props.children in your Button Render method.

If Button Component is a external component you have to use prop function like in this in Flavour 2

How can I use translations in a component title?

1 Answers1