hookehuyr

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

在非PC端且非微信PC端环境下,添加视频播放和暂停的事件监听,以隐藏控制条并阻止默认行为。同时,更新了wxInfo工具函数,增加isWeiXinDesktop字段以区分微信PC端。
...@@ -28,7 +28,6 @@ declare module 'vue' { ...@@ -28,7 +28,6 @@ declare module 'vue' {
28 VanButton: typeof import('vant/es')['Button'] 28 VanButton: typeof import('vant/es')['Button']
29 VanCellGroup: typeof import('vant/es')['CellGroup'] 29 VanCellGroup: typeof import('vant/es')['CellGroup']
30 VanCheckbox: typeof import('vant/es')['Checkbox'] 30 VanCheckbox: typeof import('vant/es')['Checkbox']
31 - VanCol: typeof import('vant/es')['Col']
32 VanDatePicker: typeof import('vant/es')['DatePicker'] 31 VanDatePicker: typeof import('vant/es')['DatePicker']
33 VanField: typeof import('vant/es')['Field'] 32 VanField: typeof import('vant/es')['Field']
34 VanForm: typeof import('vant/es')['Form'] 33 VanForm: typeof import('vant/es')['Form']
...@@ -40,7 +39,6 @@ declare module 'vue' { ...@@ -40,7 +39,6 @@ declare module 'vue' {
40 VanPopup: typeof import('vant/es')['Popup'] 39 VanPopup: typeof import('vant/es')['Popup']
41 VanProgress: typeof import('vant/es')['Progress'] 40 VanProgress: typeof import('vant/es')['Progress']
42 VanRate: typeof import('vant/es')['Rate'] 41 VanRate: typeof import('vant/es')['Rate']
43 - VanRow: typeof import('vant/es')['Row']
44 VanTab: typeof import('vant/es')['Tab'] 42 VanTab: typeof import('vant/es')['Tab']
45 VanTabs: typeof import('vant/es')['Tabs'] 43 VanTabs: typeof import('vant/es')['Tabs']
46 VanToast: typeof import('vant/es')['Toast'] 44 VanToast: typeof import('vant/es')['Toast']
......
...@@ -77,7 +77,16 @@ const handleMounted = (payload) => { ...@@ -77,7 +77,16 @@ const handleMounted = (payload) => {
77 if (props.autoplay) { 77 if (props.autoplay) {
78 player.value.play(); 78 player.value.play();
79 } 79 }
80 - if (!wxInfo().isPc) { 80 +
81 + if (!wxInfo().isPc && !wxInfo().isWeiXinDesktop) { // 非PC端,且非微信PC端
82 + // 监听视频播放状态
83 + player.value.on('play', () => {
84 + // 播放时隐藏controls
85 + player.value.controlBar.hide();
86 + });
87 + player.value.on('pause', () => {
88 +
89 + })
81 // 添加touchstart事件监听 90 // 添加touchstart事件监听
82 player.value.on('touchstart', (event) => { 91 player.value.on('touchstart', (event) => {
83 // 阻止事件冒泡,避免触发controls的默认行为 92 // 阻止事件冒泡,避免触发controls的默认行为
......
1 /* 1 /*
2 * @Date: 2022-04-18 15:59:42 2 * @Date: 2022-04-18 15:59:42
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2023-02-24 16:13:06 4 + * @LastEditTime: 2025-03-25 17:03:47
5 - * @FilePath: /data-table/src/utils/tools.js 5 + * @FilePath: /mlaj/src/utils/tools.js
6 * @Description: 文件描述 6 * @Description: 文件描述
7 */ 7 */
8 import dayjs from 'dayjs'; 8 import dayjs from 'dayjs';
...@@ -24,6 +24,7 @@ const wxInfo = () => { ...@@ -24,6 +24,7 @@ const wxInfo = () => {
24 let isIpad = u.indexOf('iPad') > -1; // iPad平台 24 let isIpad = u.indexOf('iPad') > -1; // iPad平台
25 let uAgent = navigator.userAgent.toLowerCase(); 25 let uAgent = navigator.userAgent.toLowerCase();
26 let isWeiXin = (uAgent.match(/MicroMessenger/i) == 'micromessenger') ? true : false; 26 let isWeiXin = (uAgent.match(/MicroMessenger/i) == 'micromessenger') ? true : false;
27 + let isWeiXinDesktop = isWeiXin && uAgent.indexOf('wechat') > -1 ? true : false;
27 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; 28 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;
28 return { 29 return {
29 isAndroid, 30 isAndroid,
...@@ -31,7 +32,8 @@ const wxInfo = () => { ...@@ -31,7 +32,8 @@ const wxInfo = () => {
31 isWeiXin, 32 isWeiXin,
32 isMobile, 33 isMobile,
33 isIpad, 34 isIpad,
34 - isPC 35 + isPC,
36 + isWeiXinDesktop
35 }; 37 };
36 }; 38 };
37 39
......