File tree Expand file tree Collapse file tree 1 file changed +9
-5
lines changed
Expand file tree Collapse file tree 1 file changed +9
-5
lines changed Original file line number Diff line number Diff line change @@ -18,8 +18,8 @@ $ yarn add react-message-source
1818// translations.json
1919{
2020 " hello.world" : " Hello World" ,
21- " userProfile.greeting" : " Welcome {0}"
22- " userProfile.greeting.parameterized"
21+ " userProfile.greeting" : " Welcome {0}" ,
22+ " userProfile.greeting.parameterized" : " Welcome {userName} "
2323}
2424
2525// in MyComponent.jsx
@@ -36,14 +36,18 @@ export default withMessages(MyComponent)
3636
3737// in MyOtherComponent.jsx
3838function MyOtherComponent (props ) {
39- const { getMessage } = props;
40- return < span> {getMessage (' hello.world' )}< / span>
39+ const { getMessageWithNamedParams } = props;
40+ // 'userProfile' prefix is implicit -> actual text lookup key is 'userProfile.greeting.parameterized'
41+ const greeting = getMessageWithNamedParams (' greeting.parameterized' , {
42+ userName: ' John Doe' ,
43+ })
44+ return < span> {greeting}< / span>
4145}
4246
4347// sometimes you might like to scope the text keys and avoid repeating the common key segments
4448// in that case, you can use the curried version
4549export default compose (
46- withMessages (' hello ' ),
50+ withMessages (' userProfile ' ),
4751)(MyOtherComponent)
4852
4953// in App.jsx
You can’t perform that action at this time.
0 commit comments