腾讯播放器TCPlayer 报错：The element type must be ＜video＞的解决方法。

注意：这里的项目是用uniapp编写h5项目，但是对于vue项目和pc端应该都是可行的可以进行参考解决问题的。

在使用腾讯TCPlayer播放器时，出现了报错信息：
Uncaught (in promise) TypeError: The element type must be <video>.

报错的信息是说这个元素只能是存放video元素。

解决方法：

这里可以在html元素上先写一个div标签，这个div添加一个id名为video-content-box(id名字可以自定义).
js里面添加代码，为上面这个div添加一个元素，代码如下：

 const video = document.createElement("video")    video.setAttribute("id", "player-container-id");video.setAttribute('playsinline',true);video.setAttribute('webkit-playsinline',true)// video的属性document.getElementById("video-content-box").appendChild(video);//为这个盒子中添加一个video元素

对于video的属性，可以参考腾讯文档：

3. 最后再给腾讯的播放器添加url链接播放即可

var player = TCPlayer('player-container-id', {}); // player-container-id 为播放器容器 ID，必须与 html 中一致
player.src(this.livePlayUrl); // url 播放地址

这里要注意的是需要按照文档进行编写，把一些sdk以及script链接给引进来

文章讲解完毕。¹

谢谢 ↩︎

腾讯播放器TCPlayer 报错：The element type must be ＜video＞的解决方法。相关推荐

vue 报错 Cannot read property ‘__ob__‘ of undefined的解决方法
vue 报错 Cannot read property '__ob__' of undefined的解决方法参考文章: (1)vue 报错 Cannot read property '__ob__' ...
python 报错 AttributeError: module ‘time‘ has no attribute ‘clock 解决方法
源码如下: #引入所需要的时间库 import datetime import time#程序计时器,启动计时器 start = time.clock()#中间是放置需要测试运行时间的程序代码#计算启 ...
php 正则报错,PHP正则替换函数preg_replace()报错：Notice Use of undefined constant的解决方法分析...
本文实例讲述了PHP正则替换函数preg_replace()报错:Notice Use of undefined constant的解决方法.分享给大家供大家参考,具体如下: 环境错误级别:error ...
支付宝报错 rsa_private read error : private key is NULL解决方法
原因: 真机调试IOS支付宝功能GDB出现 rsa_private read error : private key is NULL提示调试iOS 支付宝SDK的时候,执行demo.把 Partn ...
zabbix报错cannot set resource limit: [13] Permission denied解决方法
zabbix报错cannot set resource limit: [13] Permission denied解决方法参考文章: (1)zabbix报错cannot set resource l ...
python中引入包的时候报错AttributeError: module ‘sys‘ has no attribute ‘setdefaultencoding‘解决方法？
python中引入包的时候报错AttributeError: module 'sys' has no attribute 'setdefaultencoding'解决方法? 参考文章: (1)pyth ...
vue报错 Uncaught (in promise) NavigationDuplicated {_name:““NavigationDuplicated“... 的解决方法
vue报错 Uncaught (in promise) NavigationDuplicated {_name:""NavigationDuplicated"... 的解 ...
mybatis项目报错：java.sql.SQLException: ORA-00911: 无效字符解决方法
mybatis项目报错:java.sql.SQLException: ORA-00911: 无效字符解决方法参考文章: (1)mybatis项目报错:java.sql.SQLException: ...
mysql table plugin,MySql报错Table mysql.plugin doesn’t exist的解决方法
MySql报错Table mysql.plugin doesn't exist的解决方法一般产生原因是手工更改my.ini的数据库文件存放地址导致的 mysql服务启动时候找不到内置数据库" ...
Idea导出jar包运行报错：找不到主清单属性解决方法
Idea导出jar包运行报错:找不到主清单属性解决方法参考文章: (1)Idea导出jar包运行报错:找不到主清单属性解决方法 (2)https://www.cnblogs.com/stars-on ...

腾讯播放器TCPlayer 报错：The element type must be ＜video＞的解决方法。

注意：这里的项目是用uniapp编写h5项目，但是对于vue项目和pc端应该都是可行的可以进行参考解决问题的。

解决方法：

腾讯播放器TCPlayer 报错：The element type must be ＜video＞的解决方法。相关推荐

最新文章

热门文章