如何显示 WKWebView 的网址？

Question

我想知道如何在WKWebView上显示当前URL，并在URL更改时更新。目前我添加了一个Text()，但它根本不显示URL。有什么办法可以解决吗？

WebView

import SwiftUI
import WebKit

struct WebView : UIViewRepresentable {
    
    let request: URLRequest
    private var webView: WKWebView?

    init (request: URLRequest) {
        self.webView = WKWebView()
        self.request = request
    }
    
    func makeUIView(context: Context) -> WKWebView  {
        webView?.load(request)
        return webView!
    }
    
    func updateUIView(_ uiView: WKWebView, context: Context) {
    
    }

    func URL() -> String {
        return (webView?.url)?.absoluteString ?? ""
    }

    func goBack() {
        webView?.goBack()
    }
    
    func goForward() {
        webView?.goForward()
    }
    
}

主视图

struct MainView: View {
   var webView: WebView = WebView(request: URLRequest(url: URL(string: "https://www.google.com")!))

 var body: some View {
  VStack {
   //...
   Text(webView.URL())
   webView
   Button(action: { webView.goBack() }, label: { Text("Test") })
//...
  }
 }

- James Lee

---

你目前的结构方式（与我之前回答的问题相同）可能会影响程序的运行。建议先解决这个问题。 - jnpdx

@jnpdx 我刚看到了你的答案。我已相应地编辑了我的答案。再次感谢你的帮助！ - James Lee

Answer 1

为了追踪 WKWebView 的 URL，您需要使用 WKNavigationDelegate。您可以将 Coordinator 用在 UIViewRepresentable 中作为 WKNavigationDelegate，并且可以使用 @Published 值的 ObservableObject 在 WebView 和您的父视图之间进行通信。

class NavigationState : ObservableObject {
    @Published var url : URL?
}

struct WebView : UIViewRepresentable {
    
    let request: URLRequest
    var navigationState : NavigationState
    
    func makeCoordinator() -> Coordinator {
        return Coordinator()
    }
    
    func makeUIView(context: Context) -> WKWebView  {
        let webView = WKWebView()
        context.coordinator.navigationState = navigationState
        webView.navigationDelegate = context.coordinator
        webView.load(request)
        return webView
    }
    
    func updateUIView(_ uiView: WKWebView, context: Context) {
        
    }

    class Coordinator : NSObject, WKNavigationDelegate {
        var navigationState : NavigationState?
        
        func webView(_ webView: WKWebView, didCommit navigation: WKNavigation!) {
            navigationState?.url = webView.url
        }
    }
    
}

struct ContentView: View {
    @StateObject var navigationState = NavigationState()
    
    var body: some View {
        VStack(){
            Text(navigationState.url?.absoluteString ?? "(none)")
            WebView(request: URLRequest(url: URL(string: "https://www.google.com")!), navigationState: navigationState)
        }
    }
}

基于评论更新：

class NavigationState : NSObject, ObservableObject {
    @Published var url : URL?
    let webView = WKWebView()
}

extension NavigationState : WKNavigationDelegate {
    func webView(_ webView: WKWebView, didCommit navigation: WKNavigation!) {
        self.url = webView.url
    }
}

struct WebView : UIViewRepresentable {
    
    let request: URLRequest
    var navigationState : NavigationState
    
    func makeUIView(context: Context) -> WKWebView  {
        let webView = navigationState.webView
        webView.navigationDelegate = navigationState
        webView.load(request)
        return webView
    }
    
    func updateUIView(_ uiView: WKWebView, context: Context) { }
}

struct ContentView: View {
    @StateObject var navigationState = NavigationState()
    
    var body: some View {
        VStack(){
            Text(navigationState.url?.absoluteString ?? "(none)")
            WebView(request: URLRequest(url: URL(string: "https://www.google.com")!), navigationState: navigationState)
            HStack {
                Button("Back") {
                    navigationState.webView.goBack()
                }
                Button("Forward") {
                    navigationState.webView.goForward()
                }
            }
        }
    }
}

- jnpdx

---

唯一的问题是我有其他的函数，例如goBack和goForward。如果我不将webView设置为变量，我不太确定如何调用goBack()函数。我更新了我的帖子，这样你就可以更好地理解了。 - James Lee

根据您的新要求，我刚刚更新了我的答案。 - jnpdx