Problem:
React setzt die Ausgabe als Text ein
<img src="{article.imagePath}" alt="{article.title}" |
Erzeugt in der HTML Ausgabe im Browser
<img src="{article.imagePath}" alt="Kontakt Adresse Email Telefon" class="list_img"> |
Lösung in React
Man muss in React keine Hochkommas einfügen sondern nur den React-Klammer{..} Ausdruck, denn die Hochkommas werden durch den Compiler automatisch eingefügt
Richtig:
<img src={article.imagePath} alt={article.title} class="list_img" /> |
Solution: React.js Code
//========< Fill HTML >====== static renderTable(articles) { return ( <div id="divMain_List" class="list_Div_Main" > {articles.map(article => <div class="list_Div_Row">
<a href="{article.title}" title="" class="list_href"> <div class="list_folder">{article.folder}</div> <div class="list_title">{article.title}</div> <div class="list_div_img"> <img src={article.imagePath} alt={article.title} class="list_img" /> </div> <div class="list_div_text"> {article.textContent} </div> </a> </div>
)} </div> ); } //========</ Fill HTML >====== |
Korrekt nach React Ändrung