SwiftUI中如何在Text扩展函数中为Text UI赋值更新后的值

你当前的实现存在核心问题：翻译操作是异步执行的，但translate函数会同步返回一个Text实例——此时translated还是空字符串，后续异步回调里修改translated的值，不会触发已返回的Text视图更新。因为SwiftUI是状态驱动的，值类型的Text没有内置的状态绑定机制，无法在异步操作完成后自动刷新。

正确实现思路 #

不能通过Text的扩展来完成这个需求，必须借助状态管理来触发UI刷新。推荐两种方案：

方案一：自定义TranslatedText视图（轻量场景）

创建一个独立视图，内部用@State管理翻译结果，在视图出现时触发异步翻译：

struct TranslatedText: View {
    let originalText: String
    @State private var translatedText: String?
    
    var body: some View {
        // 翻译完成前显示原文本，完成后显示翻译结果
        Text(translatedText ?? originalText)
            .onAppear {
                performTranslation()
            }
    }
    
    private func performTranslation() {
        let conditions = ModelDownloadConditions(allowsCellularAccess: true, allowsBackgroundDownloading: true)
        GoogleTranslatorManager.shared.translator?.downloadModelIfNeeded(with: conditions) { error in
            guard error == nil else { return }
            
            GoogleTranslatorManager.shared.translator?.translate(self.originalText) { translatedText, error in
                guard error == nil, let translatedText = translatedText else {
                    return
                }
                // 必须回到主队列更新UI状态
                DispatchQueue.main.async {
                    self.translatedText = translatedText
                }
            }
        }
    }
}

// 使用方式
TranslatedText(originalText: "Hello World")

方案二：用ViewModel管理（复杂场景）

如果需要在多个视图复用翻译逻辑，或结合更多业务状态，使用ObservableObject：

class TranslationViewModel: ObservableObject {
    @Published var translatedText: String?
    let originalText: String
    
    init(originalText: String) {
        self.originalText = originalText
        performTranslation()
    }
    
    private func performTranslation() {
        let conditions = ModelDownloadConditions(allowsCellularAccess: true, allowsBackgroundDownloading: true)
        GoogleTranslatorManager.shared.translator?.downloadModelIfNeeded(with: conditions) { error in
            guard error == nil else { return }
            
            GoogleTranslatorManager.shared.translator?.translate(self.originalText) { translatedText, error in
                guard error == nil, let translatedText = translatedText else {
                    return
                }
                DispatchQueue.main.async {
                    self.translatedText = translatedText
                }
            }
        }
    }
}

// 使用方式
struct ContentView: View {
    @StateObject private var vm = TranslationViewModel(originalText: "Hello World")
    
    var body: some View {
        Text(vm.translatedText ?? vm.originalText)
    }
}

关键注意事项 #

• 异步回调中更新UI状态时，必须切换到主队列（DispatchQueue.main.async），否则会触发线程错误。
• 可以额外添加加载状态，比如在翻译过程中显示"加载中..."或进度动画，提升用户体验。

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