sileya-ai
/
vr-shopxo-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改拖拽逻辑

master
于肖磊 2026-02-28 14:05:09 +08:00
parent 7c4403aefb
commit 1925a599da
1 changed files with 52 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
pages/plugins/video/detail/detail.vue
View File

@ -88,11 +88,12 @@
<!-- 评论弹窗 --> <!-- 评论弹窗 -->
<view v-if="show_comment_modal" class="comment-modal" @tap="close_comment_modal"> <view v-if="show_comment_modal" class="comment-modal" @tap="close_comment_modal">
<view class="comment-content bottom-line-exclude-bottom" :style="commentContentStyle" @tap.stop @touchstart="handle_comment_touch_start" @touchmove="handle_comment_touch_move" @touchend="handle_comment_touch_end"> <view class="comment-content bottom-line-exclude-bottom" :style="commentContentStyle">
<view class="comment-header"> <view class="comment-header" data-type="header" @tap.stop @touchstart="handle_comment_touch_start" @touchmove="handle_comment_touch_move" @touchend="handle_comment_touch_end">
<text class="comment-count">{{$t('common.comment')}}</text> <text class="comment-count">{{$t('common.comment')}}</text>
<view class="close-btn" @tap="close_comment_modal">✕</view> <view class="close-btn" @tap="close_comment_modal">✕</view>
</view> </view>
<view class="flex-1 flex-row" data-type="scroll" @tap.stop @touchstart="handle_comment_touch_start" @touchmove="handle_comment_touch_move" @touchend="handle_comment_touch_end">
<!-- 评论内容区域 --> <!-- 评论内容区域 -->
<scroll-view class="comment-list" scroll-y :scroll-top="comment_scroll_top" show-scrollbar="false" scroll-with-animation @scrolltolower="handle_comment_to_lower_scroll" @scroll="handle_comment_scroll"> <scroll-view class="comment-list" scroll-y :scroll-top="comment_scroll_top" show-scrollbar="false" scroll-with-animation @scrolltolower="handle_comment_to_lower_scroll" @scroll="handle_comment_scroll">
<view class="comment-scroll"> <view class="comment-scroll">
@ -137,6 +138,8 @@
</template> </template>
</view> </view>
</scroll-view> </scroll-view>
</view>
<view v-if="base_config_data && base_config_data.is_video_comments_add && base_config_data.is_video_comments_add == 1" class="comment-input-container"> <view v-if="base_config_data && base_config_data.is_video_comments_add && base_config_data.is_video_comments_add == 1" class="comment-input-container">
<view class="comment-input-content flex-col jc-c"> <view class="comment-input-content flex-col jc-c">
<view v-if="!isEmpty(comments_reply_data)" class="comment-reply-content flex-row align-c jc-sb gap-10"> <view v-if="!isEmpty(comments_reply_data)" class="comment-reply-content flex-row align-c jc-sb gap-10">
@ -1019,8 +1022,9 @@
}, },
// 评论拖拽开始 // 评论拖拽开始
handle_comment_touch_start(e) { handle_comment_touch_start(e) {
// 只有滚动到顶部时才允许拖拽 const type = e?.target?.dataset?.type || 'header';
if (this.comment_scroll_top <= 5) { // 如果是滚动区域内滚动到顶部才可以拖拽，如果是头部拖拽的话，一直都可以
if ((this.comment_scroll_top <= 5 && type == 'scroll') || type == 'header') {
this.comment_start_y = e.touches[0].pageY; this.comment_start_y = e.touches[0].pageY;
this.comment_current_y = this.comment_start_y; this.comment_current_y = this.comment_start_y;
this.move_distance = 0; this.move_distance = 0;
@ -1028,8 +1032,9 @@
}, },
// 评论拖拽中 // 评论拖拽中
handle_comment_touch_move(e) { handle_comment_touch_move(e) {
// 只有滚动到顶部时才允许拖拽 const type = e?.target?.dataset?.type || 'header';
if (this.comment_scroll_top <= 5) { // 如果是滚动区域内滚动到顶部才可以拖拽，如果是头部拖拽的话，一直都可以
if ((this.comment_scroll_top <= 5 && type == 'scroll') || type == 'header') {
this.comment_current_y = e.touches[0].pageY; this.comment_current_y = e.touches[0].pageY;
this.move_distance = this.comment_current_y - this.comment_start_y; this.move_distance = this.comment_current_y - this.comment_start_y;
} }
@ -1037,8 +1042,9 @@
// 评论拖拽结束 // 评论拖拽结束
handle_comment_touch_end(e) { handle_comment_touch_end(e) {
// 只有滚动到顶部时才允许拖拽 const type = e?.target?.dataset?.type || 'header';
if (this.comment_scroll_top <= 5) { // 如果是滚动区域内滚动到顶部才可以拖拽，如果是头部拖拽的话，一直都可以
if ((this.comment_scroll_top <= 5 && type == 'scroll') || type == 'header') {
const move_distance = this.comment_current_y - this.comment_start_y; const move_distance = this.comment_current_y - this.comment_start_y;
// 如果拖拽距离足够大，关闭评论弹窗 // 如果拖拽距离足够大，关闭评论弹窗
if (move_distance > 150) { if (move_distance > 150) {