uniapp中scroll-view实现左侧右侧联动

在uni-app中，`<scroll-view>` 组件用于创建滚动视图容器，用户可以在其中滑动查看内容。当想要实现在 `<scroll-view>` 中左右两侧的内容联动时，通常需要利用到事件监听、数据绑定以及一些自定义的计算逻辑。

### 实现原理

1. **事件监听**：首先，在主 `<scroll-view>` 内部设置滚动事件，如 `bindscroll` 或者直接使用 `@scroll`，以便获取滚动位置信息。

   <scroll-view scroll-x="true" bindscroll="onScroll">
     <!-- 内容区域 -->
   </scroll-view>

其中 `scroll-x="true"` 表示水平滚动。

JavaScript 部分：

   export default {
     data() {
       return {
         scrollLeft: 0 // 初始化滚动位置为0
       };
     },
     methods: {
       onScroll(e) {
         this.scrollLeft = e.detail.scrollX; // 获取当前滚动位置
       }
     }
   };

2. **数据绑定**：基于获取到的滚动位置，可以将这个值应用于另一个 `<scroll-view>` 的 `scroll-left` 属性上，以此实现联动效果。

   <view class="container">
     <!-- 左侧联动滚动区 -->
     <scroll-view scroll-x "true" :scroll-left="scrollLeft">
       <!-- 左侧内容 -->
     </scroll-view>

     <!-- 右侧内容 -->
     <scroll-view scroll-y="true">
       <!-- 右侧内容 -->
     </scroll-view>
   </view>

3. **计算属性/方法**：如果需要更复杂的效果，比如根据滚动的位置调整右侧内容的高度或其他动态属性，可以使用 Vue.js 的计算属性或方法来实现。

### 相关问题:

1. 在 `uni-app` 中如何控制滚动视图的动画效果?
2. 如何在 `uni-app` 中实现垂直滚动视图的自动跟随？
3. `uni-app` 中如何优化滚动性能避免卡顿现象？