如何在自定义AsyncImageCached的init外部存储ViewBuilder参数

解决方案核心思路 #

通过类型擦除隐藏初始化方法局部泛型I、P的具体类型，无需修改结构体顶层泛型定义，也不用调整现有初始化签名，完全匹配官方AsyncImage的API规范。

具体实现步骤 #

1. 首先在结构体内部定义一个私有枚举，统一管理三种初始化对应的内容提供逻辑，避免定义多个零散的可选存储属性：

public struct AsyncImageCached<Content> : View where Content : View {
    // 已有公共存储属性，比如url、scale
    private let url: URL?
    private let scale: CGFloat
    // 统一管理不同初始化的内容逻辑
    private enum ContentProvider {
        case plain(scale: CGFloat) // 对应仅传url的初始化
        case phase((AsyncImagePhase) -> Content) // 对应传入phase闭包的初始化
        case contentPlaceholder(
            content: (Image) -> AnyView,
            placeholder: () -> AnyView
        ) // 对应当前需要处理的content+placeholder初始化
    }
    private let contentProvider: ContentProvider

2. 改造你当前报错的初始化方法，将局部泛型的闭包做类型擦除后存入contentProvider：

init<I, P>(url: URL?, scale: CGFloat = 1, 
        @ViewBuilder content: @escaping (Image) -> I,
        @ViewBuilder placeholder: @escaping () -> P)
        where Content == _ConditionalContent<I, P>, I : View, P : View {
            self.url = url
            self.scale = scale
            // 对闭包做类型擦除，隐藏I、P的具体类型
            self.contentProvider = .contentPlaceholder(
                content: { image in AnyView(content(image)) },
                placeholder: { AnyView(placeholder()) }
            )
            // 其余初始化逻辑
    }

3. 适配另外两个已有的初始化方法：

public init(url: URL?, scale: CGFloat = 1) where Content == Image {
        self.url = url
        self.scale = scale
        self.contentProvider = .plain(scale: scale)
        // 其余初始化逻辑
    }

    public init(url: URL?, scale: CGFloat = 1, @ViewBuilder content: @escaping (AsyncImagePhase) -> Content) {
        self.url = url
        self.scale = scale
        self.contentProvider = .phase(content)
        // 其余初始化逻辑
    }

4. 在body中根据contentProvider的类型处理渲染逻辑即可：

public var body: some View {
        // 此处替换为你自己的异步图片加载逻辑，获取当前加载状态
        let loadState: AsyncImagePhase = // 你的加载状态：loading/success/error
        switch contentProvider {
        case .plain(let scale):
            // 仅传url的场景，加载成功返回Image，失败返回空视图
            if let image = loadState.image {
                image.scale(scale)
            } else {
                EmptyView()
            }
        case .phase(let contentBlock):
            // 传入phase闭包的场景，直接传递状态调用闭包
            contentBlock(loadState)
        case .contentPlaceholder(let contentBlock, let placeholderBlock):
            // content+placeholder的场景，根据加载状态调用对应闭包
            if let image = loadState.image {
                contentBlock(image)
            } else {
                placeholderBlock()
            }
        }
    }
}

原理解释 #

你之前报错的根本原因是I、P属于初始化方法的局部泛型，仅在init的作用域内有效，结构体顶层无法感知这两个类型的存在，因此不能直接用它们定义存储属性。
通过AnyView做类型擦除后，我们只保留了闭包的调用能力，隐藏了具体的返回View类型，既不需要把I、P提到结构体泛型层面破坏现有接口，也能满足异步加载完成后调用对应闭包渲染的需求。这种实现完全对齐官方AsyncImage的设计思路，性能开销可以忽略不计。

内容的提问来源于stack exchange，提问作者J. Edgell