Svelte 動(dòng)態(tài)屬性

您可以使用花括號(hào)來(lái)控制元素屬性，就像使用它們來(lái)控制文本一樣。

我們的圖像缺少 ?src? 屬性——讓我們添加一個(gè)：

<img src={src}>

那更好。但是 Svelte 給了我們一個(gè)警告：

A11y: <img> element should have an alt attribute

在構(gòu)建 Web 應(yīng)用程序時(shí)，重要的是要確保它們可供盡可能廣泛的用戶群訪問(wèn)，包括（例如）視力或運(yùn)動(dòng)受損的人，或者沒(méi)有強(qiáng)大硬件或良好互聯(lián)網(wǎng)連接的人?？稍L問(wèn)性（縮寫(xiě)為 a11y）并不總是很容易做到正確，但如果您編寫(xiě)了不可訪問(wèn)的標(biāo)記，Svelte 會(huì)通過(guò)警告來(lái)幫助您。

在這種情況下，我們?nèi)鄙?nbsp;?alt? 屬性，該屬性為使用屏幕閱讀器的人或互聯(lián)網(wǎng)連接速度慢或不穩(wěn)定而無(wú)法下載圖像的人描述圖像。讓我們添加一個(gè)：

<img src={src} alt="A man dances.">

我們可以在屬性中使用大括號(hào)。嘗試將其更改為?"{name} dances"?。 — 記得在 ?<script>? 塊中聲明一個(gè) ?name? 變量。

屬性簡(jiǎn)寫(xiě)

名稱和值相同的屬性并不少見(jiàn)，例如 ?src={src}?。 Svelte 為我們提供了這些情況的便捷簡(jiǎn)寫(xiě)：

<img {src} alt="A man dances.">