uniapp中swiper+view，切换tab如何实现高度记忆功能，注意不用scroll-view而是用view

在 `swiper` 组件中切换 `view` 时，可以通过设置 `v-if` 或 `v-show` 控制 `view` 的显示与隐藏。为了实现高度记忆功能，我们需要在 `view` 中设置一个自定义属性，例如 `height`，用于记录当前 `view` 的高度。然后在 `swiper` 的 `change` 事件中，获取当前 `view` 的高度并保存到对应的 `view` 中，这样在下次切换到该 `view` 时，可以通过 `height` 属性设置 `view` 的高度，从而实现高度记忆功能。

具体实现步骤如下：

1. 在 `view` 中设置一个自定义属性 `height`，用于记录当前 `view` 的高度，例如：

<view v-show="activeTab === 0" height="{{tabHeights[0]}}">...</view>
<view v-show="activeTab === 1" height="{{tabHeights[1]}}">...</view>
<view v-show="activeTab === 2" height="{{tabHeights[2]}}">...</view>

2. 在 `swiper` 的 `change` 事件中，获取当前 `view` 的高度并保存到对应的 `view` 中，例如：

<swiper @change="handleChange">
  <swiper-item>
    <view>...</view>
  </swiper-item>
  <swiper-item>
    <view>...</view>
  </swiper-item>
  <swiper-item>
    <view>...</view>
  </swiper-item>
</swiper>

...

data() {
  return {
    activeTab: 0,
    tabHeights: [0, 0, 0]
  };
},
methods: {
  handleChange(e) {
    const { current } = e.detail;
    const query = uni.createSelectorQuery().in(this);
    query.select(`#tab-${current}`).boundingClientRect((rect) => {
      this.tabHeights[current] = rect.height;
    }).exec();
    this.activeTab = current;
  }
}

3. 在 `view` 中动态设置高度，例如：

<view v-show="activeTab === 0" :style="{ height: tabHeights[0] + 'px' }">...</view>
<view v-show="activeTab === 1" :style="{ height: tabHeights[1] + 'px' }">...</view>
<view v-show="activeTab === 2" :style="{ height: tabHeights[2] + 'px' }">...</view>

这样就可以实现在切换 `view` 时记忆高度的功能了。