Skip to content

i18n(zh-cn): Update images.mdx #12459

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 1 commit into from
Sep 28, 2025
Merged

i18n(zh-cn): Update images.mdx #12459

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
27 changes: 27 additions & 0 deletions src/content/docs/zh-cn/guides/images.mdx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -432,6 +432,33 @@ import Logo from '../assets/logo.svg';
<Logo width={64} height={64} fill="currentColor" />
```

#### `SvgComponent` 类型

<Since v="5.14.0" />

你也可以使用 `SvgComponent` 类型对 `.svg` 资源强制实施类型安全：

```astro title="src/components/Logo.astro"
---
import type { SvgComponent } from "astro/types";
import HomeIcon from './Home.svg'

interface Link {
url: string
text: string
icon: SvgComponent
}

const links: Link[] = [
{
url: '/',
text: 'Home',
icon: HomeIcon
}
]
---
```

### 创建自定义图像组件

你可以通过将 `<Image />` 或 `<Picture/>` 组件包装在另一个 Astro 组件中来创建自定义、可重用的图像组件。这允许你只设置一次默认属性和样式。
Expand Down