ReactでイメージURLを解析する方法は？

Question

私はここに新しいです、私は些細な質問をしている場合は謝罪しますが、どこでも答えを見つけることができませんでした。私は画像を表示するために私のリンクを解析する必要があります。画像は形式などです。ライン19を参照してください - p8983.png

は、だから私は8

const targetImage = `public/assets/p${playerData.player.id}.png`;

これは動作しません/レンダーするを参照してくださいライン--->でそれを解析する方法がわから、正しくない、このリンクを構築します <div><img src="{targetImage}"></img></div>

2番目の問題は、JSONからプルされた値の計算方法を知らないことです（行17,18（すべてが文字列として表示されます））。

<div>Passes per minute: {playerData.stats[4].value} + {playerData.stats[8].value}/{playerData.stats[7].value}</div>

数学の計算後のレンダリングと画像と値

Answer 1

あなたのコードと何がしたいとの微妙な違いがあります：あなたのイメージの源は文字通りの文字列"{targetImage}"に設定します<img src="{targetImage}">、明らかに無効です。 React propsの正しい書式は<img src={targetImage}>です。希望の出力が得られるはずです。

FacebookのJSX in Depthを必ず読んで違いを知ってください。そういう間違いを避けて、JSXとReactの理解を深めることができます。あなたが間違ったことを理解するのに役立ちます！