如何为AsyncImage设置尺寸以适配指定Frame？

你需要给AsyncImage添加resizable()修饰符，让图片支持尺寸调整，再结合缩放模式来适配指定的Frame：

方案一：保持图片比例并完整显示（适配Frame边界内） #

AsyncImage(url: URL(string: mockImageUrl))
    .resizable()
    .scaledToFit()
    .frame(width: 200, height: 300)

方案二：填充整个Frame（可能裁剪图片超出部分） #

如果需要图片完全填满设定的Frame，可使用scaledToFill()配合clipped()裁剪超出区域：

AsyncImage(url: URL(string: mockImageUrl))
    .resizable()
    .scaledToFill()
    .frame(width: 200, height: 300)
    .clipped()

原理说明：默认状态下AsyncImage会以图片原始尺寸渲染，仅设置frame只是限定了容器的大小，不会改变图片本身的尺寸。添加resizable()后，图片才允许被缩放，再通过scaledToFit/scaledToFill控制缩放逻辑，从而适配设定的Frame尺寸。

内容的提问来源于stack exchange，提问作者Johnatan Kayevo