我正在嘗試根據一些可變數據訪問 URL。{ this.state.countries.map((country, key) => { return <a key={country.iso2}> <img src="https://www.countryflags.io/{country.iso2}/shiny/24.png" /> </a>; });}上述 URL 中的值{country.iso2}是動態的。請幫我正確設置 URL 格式。
5 回答
繁花如伊
TA貢獻2012條經驗 獲得超12個贊
嘗試模板文字。back tick注意and的使用$
<img?src=`https://www.countryflags.io/${country.iso2}/shiny/24.png`/>
HUX布斯
TA貢獻1876條經驗 獲得超6個贊
當您使用 jsx 時，您必須添加花括號，然后添加模板文字，然后添加由 包圍的變量${}，如下所示：
let country = { iso2: "au" };
ReactDOM.render(
<img src={`https://www.countryflags.io/${country.iso2}/shiny/24.png`} />,
root
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>
慕田峪9158850
TA貢獻1794條經驗 獲得超7個贊
你可以這樣做
{this.state.countries.map((country, key) => {
return
<a key={country.iso2}>
<img src=`https://www.countryflags.io/${country.iso2}/shiny/24.png`/>
</a>
})}
搖曳的薔薇
TA貢獻1793條經驗 獲得超6個贊
使用反引號和美元符號
{this.state.countries.map((country, key) => {
return
<a key={country.iso2}>
<img src=`https://www.countryflags.io/${country.iso2}/shiny/24.png`/>
</a>
})}
- 5 回答
- 0 關注
- 209 瀏覽
添加回答
舉報
0/150
提交
取消