如何实现UITableView点击不同行展示对应YouTube视频（WKWebView）

嘿，这个问题很常见——你现在的核心问题是没有把每个单元格和对应的视频标识（比如YouTube视频ID）绑定起来，导致点击时都调用了同一个固定的视频URL。我给你一步步拆解解决方案：

1. 先准备关联的数据源 #

首先，你需要一个能同时存储单元格标题和对应YouTube视频ID的数据源。推荐用结构体来封装，这样代码更清晰：

// 定义一个结构体，存储每个视频的标题和ID
struct VideoItem {
    let title: String
    let youtubeID: String
}

// 在你的ViewController里初始化数据源数组
private let videoItems: [VideoItem] = [
    VideoItem(title: "视频1标题", youtubeID: "你的第一个视频ID"),
    VideoItem(title: "视频2标题", youtubeID: "你的第二个视频ID"),
    VideoItem(title: "视频3标题", youtubeID: "你的第三个视频ID"),
    VideoItem(title: "视频4标题", youtubeID: "你的第四个视频ID"),
    VideoItem(title: "视频5标题", youtubeID: "你的第五个视频ID")
]

2. 用新的数据源配置UITableView #

修改你的UITableView数据源方法，用上面的数组来渲染每个单元格的标题：

override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    // 返回数据源的数量，也就是你的5个单元格
    return videoItems.count
}

override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    // 替换成你自己的Cell复用ID
    let cell = tableView.dequeueReusableCell(withIdentifier: "VideoCell", for: indexPath)
    let currentItem = videoItems[indexPath.row]
    // 设置单元格标题
    cell.textLabel?.text = currentItem.title
    return cell
}

3. 处理单元格点击事件，加载对应视频 #

在didSelectRowAt方法里，根据点击的行拿到对应的视频ID，生成正确的YouTube嵌入URL（WKWebView加载嵌入页面是最稳定的方式），然后弹出展示：

override func tableView(_ tableView: UITableView, didSelectRowAt indexPath: IndexPath) {
    // 先取消单元格的选中状态，提升用户体验
    tableView.deselectRow(at: indexPath, animated: true)
    
    // 获取当前点击行对应的视频信息
    let selectedVideo = videoItems[indexPath.row]
    // 生成YouTube嵌入URL（替换成对应ID）
    guard let embedURL = URL(string: "https://www.youtube.com/embed/\(selectedVideo.youtubeID)") else {
        print("无效的视频URL")
        return
    }
    
    // 这里用自定义弹窗展示WKWebView，你也可以用单独的ViewController来展示
    let webView = WKWebView(frame: CGRect(x: 0, y: 0, width: UIScreen.main.bounds.width - 40, height: 300))
    webView.load(URLRequest(url: embedURL))
    
    // 创建弹窗控制器
    let alertVC = UIAlertController(title: selectedVideo.title, message: nil, preferredStyle: .alert)
    alertVC.view.addSubview(webView)
    
    // 给WebView添加约束，确保在弹窗里正确显示
    webView.translatesAutoresizingMaskIntoConstraints = false
    NSLayoutConstraint.activate([
        webView.topAnchor.constraint(equalTo: alertVC.view.topAnchor, constant: 20),
        webView.leadingAnchor.constraint(equalTo: alertVC.view.leadingAnchor, constant: 20),
        webView.trailingAnchor.constraint(equalTo: alertVC.view.trailingAnchor, constant: -20),
        webView.heightAnchor.constraint(equalToConstant: 300)
    ])
    
    // 添加关闭按钮
    alertVC.addAction(UIAlertAction(title: "关闭", style: .cancel))
    // 弹出弹窗
    present(alertVC, animated: true)
}

几个关键注意点 #

• 确保你的Cell复用ID和Storyboard/代码中注册的ID完全一致，否则会崩溃
• 如果你的App需要适配iOS 14及以下，记得在Info.plist中配置NSAppTransportSecurity，允许加载HTTPS链接（不过现在iOS默认允许，但若出现加载失败可以检查这个）
• 如果你觉得弹窗展示不够美观，也可以创建一个专门的VideoPlayerViewController，把视频ID传过去，在这个VC里初始化WKWebView并加载URL，然后用push或present的方式展示

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