uniapp中 自定义弹窗中子组件scroll-view滑动到底部时，其他层级的页面也被触发滑动 如何阻其他层级页面的滑动

在uni-app中，如果你遇到自定义弹窗内部的`scroll-view`滑动到底部时导致外部页面也跟着滚动的问题，这通常是由于默认的全局滚动穿透设置引起的。你可以通过以下步骤来解决：

1. **关闭全局滚动穿透**：在弹窗组件的`options`配置中，找到并禁用`coverGlobal`属性，使其不覆盖外部滚动。示例代码如下：

   <view class="custom-popup" :options="{ coverGlobal: false }">
       <!-- ... -->
       <scroll-view :scroll-y="true"></scroll-view>
       <!-- ... -->
   </view>

2. **局部滚动限制**：如果仅希望在特定情况下阻止外部滚动，可以在`scroll-view`上添加`catchtouchmove`事件处理，拦截并阻止默认的滚动动作：

   <scroll-view :scroll-y="true" @catchtouchmove.prevent></scroll-view>

这样，当`scroll-view`滑动时，它会捕获触摸移动事件，防止外部元素响应。

相关问题

uniapp scroll-view滑动到最底部

要使一个 `scroll-view` 组件在初始加载时滑动到最底部，可以通过以下步骤实现：

1. 首先，在 `scroll-view` 上添加一个 `ref`，以便在代码中引用该组件。例如：

<scroll-view ref="scrollView" scroll-y="true" style="height: 300px;">
  <!-- 内容 -->
</scroll-view>

2. 在页面的 `mounted` 生命周期钩子函数中，获取 `scroll-view` 的高度和内容高度，并将滚动位置设置为最底部。可以使用 `uni.createSelectorQuery()` 来获取元素的高度。例如：

mounted() {
  uni.nextTick(() => {
    const scrollView = uni.createSelectorQuery().select('#scrollView');
    const content = uni.createSelectorQuery().select('#content');

    scrollView.boundingClientRect().exec(([scrollViewRect]) => {
      content.boundingClientRect().exec(([contentRect]) => {
        const scrollTop = contentRect.height - scrollViewRect.height;
        this.$refs.scrollView.scrollTo(0, scrollTop);
      });
    });
  });
}

在上述代码中，`#scrollView` 是 `scroll-view` 组件的 id，`#content` 是 `scroll-view` 内容的 id。请确保在正确的位置添加这些 id。

这样，当页面加载时，`scroll-view` 组件将会自动滑动到最底部。

有两个uniapp的scroll-view组件，滑动一个scroll-view组件的时候，另一个scroll-view组件可以同步滑动，这个代码要怎么写

可以通过在一个scroll-view组件的bindscroll事件中，使用JavaScript代码操作另一个scroll-view组件的scroll-top属性来实现。

例如：

<template>
<view class="scroll-view-container">
<scroll-view class="scroll-view-1" bindscroll="scrollHandler1">
<!-- 内容 -->
</scroll-view>
<scroll-view class="scroll-view-2" scroll-top="{{scrollTop}}">
<!-- 内容 -->
</scroll-view>
</view>
</template>

<script>
export default {
data () {
return {
scrollTop: 0
}
},
methods: {
scrollHandler1 (e) {
this.scrollTop = e.detail.scrollTop
}
}
}
</script>

通过以上代码，当滑动第一个scroll-view组件时，第二个scroll-view组件的scroll-top属性就会同步变化，实现两个scroll-view组件的同步滑动。