From 7fde30063ba03801b277bfb3c0d6673dde705d89 Mon Sep 17 00:00:00 2001
From: ZF sun <34314687@qq.com>
Date: Wed, 7 Jan 2026 17:27:42 +0800
Subject: [PATCH] =?UTF-8?q?chore(=E5=BE=AE=E4=BF=A1=E8=A7=86=E9=A2=91?=
 =?UTF-8?q?=E5=8F=B7):=20=E4=BC=98=E5=8C=96channel-video=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E7=9A=84=E6=98=BE=E7=A4=BA=EF=BC=8C=E6=9B=B4=E6=96=B0=E6=8A=80?=
 =?UTF-8?q?=E6=9C=AF=E6=96=87=E6=A1=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components-diy/diy-wechat-channel.vue | 14 +++---
 docs/WECHAT_CHANNEL_INTEGRATION.md    | 72 ++++++++++++++++++++++++---
 2 files changed, 72 insertions(+), 14 deletions(-)

diff --git a/components-diy/diy-wechat-channel.vue b/components-diy/diy-wechat-channel.vue
index bc4f4db..b0c856b 100644
--- a/components-diy/diy-wechat-channel.vue
+++ b/components-diy/diy-wechat-channel.vue
@@ -10,12 +10,14 @@
 		</view>
 		<!-- 嵌入式视频播放 -->
 		<!-- #ifdef MP-WEIXIN -->		 
-		<channel-video v-if="value.embedMode && typeof wx !== 'undefined' && wx.canIUse('component.channel-video')" 
-			:feed-id="value.feedId" 
-			:finder-user-name="value.finderUserName" 
-			:feed-token="value.feedToken" 
-			style="width: 100%; height: 320rpx;">
-		</channel-video>
+		<native-component v-if="value.embedMode && typeof wx !== 'undefined' && wx.canIUse('component.channel-video')">
+			<channel-video 
+				:feed-id="value.feedId" 
+				:finder-user-name="value.finderUserName" 
+				:feed-token="value.feedToken" 
+				style="width: 100%; height: 320rpx;">
+			</channel-video>
+		</native-component>
 		<!-- #endif -->		
 		<!-- 跳转式视频播放 -->
 		<view v-else class="channel-video" @tap="playVideo">
diff --git a/docs/WECHAT_CHANNEL_INTEGRATION.md b/docs/WECHAT_CHANNEL_INTEGRATION.md
index 28f65ab..dfd987e 100644
--- a/docs/WECHAT_CHANNEL_INTEGRATION.md
+++ b/docs/WECHAT_CHANNEL_INTEGRATION.md
@@ -204,17 +204,20 @@ if (typeof wx !== 'undefined' && wx.openChannelsActivity) {
 
 - 组件调用无资质要求
 - 暂不支持纯图片视频号内容
+- 在 UniApp 中使用时，需要用 `<native-component>` 包裹以确保组件正确显示
 
 ```vue
 <!-- #ifdef MP-WEIXIN -->
-<channel-video
-  feed-id="{{feedId}}"
-  finder-user-name="{{finderUserName}}"
-  feed-token="{{feedToken}}"
-  bindenterfullscreen="enterFullscreen"
-  bindexitfullscreen="exitFullscreen"
-  binderror="videoError"
-></channel-video>
+<native-component>
+  <channel-video
+    feed-id="{{feedId}}"
+    finder-user-name="{{finderUserName}}"
+    feed-token="{{feedToken}}"
+    bindenterfullscreen="enterFullscreen"
+    bindexitfullscreen="exitFullscreen"
+    binderror="videoError"
+  ></channel-video>
+</native-component>
 <!-- #endif -->
 ```
 
@@ -274,6 +277,7 @@ if (typeof wx !== 'undefined' && wx.openChannelsActivity) {
 - 跳转打开视频号视频需要微信小程序基础库版本 2.19.2 及以上
 - 内嵌视频号视频需要微信小程序基础库版本 2.25.1 及以上
 - 小程序与视频号关联仅在需要内嵌非同主体视频号视频（基础库 2.31.1 以下）时需要
+- 必须确保在 `manifest.json` 中设置 `usingComponents: true` 以启用组件支持
 
 ### 5.2 数据格式
 
@@ -334,6 +338,58 @@ if (typeof wx !== 'undefined' && wx.openChannelsActivity) {
 - 在其他环境中，组件会显示但无法播放视频
 - 建议在非小程序环境中添加友好的提示信息
 
+### 6.7 在uni-app中使用原生组件时，可能会遇到组件不显示的问题
+
+在uni-app中使用原生组件时，可能会遇到组件不显示的问题。以下是已验证的解决方案：
+
+#### 解决方案
+
+**方法一：使用 `<native-component>` 包裹**
+
+在 UniApp 中使用 `channel-video` 组件时，必须用 `<native-component>` 包裹以确保组件正确显示：
+
+``` vue
+<template>
+  <view>
+    <!-- #ifdef MP-WEIXIN -->
+    <native-component>
+      <channel-video 
+        feed-id="{{feedId}}" 
+        finder-user-name="{{finderUserName}}" 
+        feed-token="{{feedToken}}"
+        style="width: 100%; height: 320rpx;"
+      ></channel-video>
+    </native-component>
+    <!-- #endif -->
+  </view>
+</template>
+```
+
+**方法二：检查 `manifest.json` 配置**
+
+确保在 `manifest.json` 文件中正确设置了 `usingComponents: true`，特别是在 `mp-weixin` 部分：
+
+``` json
+"mp-weixin": {
+  "appid": "你的小程序appid",
+  "usingComponents": true,
+  // 其他配置...
+}
+```
+
+**方法三：检查微信小程序基础库版本**
+
+确保微信小程序基础库版本满足要求：
+- 跳转打开视频号视频需要基础库版本 2.19.2 及以上
+- 内嵌视频号视频需要基础库版本 2.25.1 及以上
+
+**方法四：检查参数是否正确**
+
+确保传递给 `channel-video` 组件的参数正确：
+- `feedId`：视频号内容ID，必填
+- `finderUserName`：视频号ID，可选
+- `feedToken`：非同主体视频号视频的标识，可选（基础库 2.31.1+）
+
 ## 7. 示例代码
 
 ### 7.1 单个视频号示例