hookehuyr

refactor(VideoPlayer): 优化非PC端视频播放控制逻辑

在非PC端且非微信PC端环境下,添加视频播放和暂停的事件监听,以隐藏控制条并阻止默认行为。同时,更新了wxInfo工具函数,增加isWeiXinDesktop字段以区分微信PC端。
......@@ -28,7 +28,6 @@ declare module 'vue' {
VanButton: typeof import('vant/es')['Button']
VanCellGroup: typeof import('vant/es')['CellGroup']
VanCheckbox: typeof import('vant/es')['Checkbox']
VanCol: typeof import('vant/es')['Col']
VanDatePicker: typeof import('vant/es')['DatePicker']
VanField: typeof import('vant/es')['Field']
VanForm: typeof import('vant/es')['Form']
......@@ -40,7 +39,6 @@ declare module 'vue' {
VanPopup: typeof import('vant/es')['Popup']
VanProgress: typeof import('vant/es')['Progress']
VanRate: typeof import('vant/es')['Rate']
VanRow: typeof import('vant/es')['Row']
VanTab: typeof import('vant/es')['Tab']
VanTabs: typeof import('vant/es')['Tabs']
VanToast: typeof import('vant/es')['Toast']
......
......@@ -77,7 +77,16 @@ const handleMounted = (payload) => {
if (props.autoplay) {
player.value.play();
}
if (!wxInfo().isPc) {
if (!wxInfo().isPc && !wxInfo().isWeiXinDesktop) { // 非PC端,且非微信PC端
// 监听视频播放状态
player.value.on('play', () => {
// 播放时隐藏controls
player.value.controlBar.hide();
});
player.value.on('pause', () => {
})
// 添加touchstart事件监听
player.value.on('touchstart', (event) => {
// 阻止事件冒泡,避免触发controls的默认行为
......
/*
* @Date: 2022-04-18 15:59:42
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2023-02-24 16:13:06
* @FilePath: /data-table/src/utils/tools.js
* @LastEditTime: 2025-03-25 17:03:47
* @FilePath: /mlaj/src/utils/tools.js
* @Description: 文件描述
*/
import dayjs from 'dayjs';
......@@ -24,6 +24,7 @@ const wxInfo = () => {
let isIpad = u.indexOf('iPad') > -1; // iPad平台
let uAgent = navigator.userAgent.toLowerCase();
let isWeiXin = (uAgent.match(/MicroMessenger/i) == 'micromessenger') ? true : false;
let isWeiXinDesktop = isWeiXin && uAgent.indexOf('wechat') > -1 ? true : false;
let isPC = (uAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone|micromessenger)/i)) ? false : true;
return {
isAndroid,
......@@ -31,7 +32,8 @@ const wxInfo = () => {
isWeiXin,
isMobile,
isIpad,
isPC
isPC,
isWeiXinDesktop
};
};
......