在uni-app中使用Vue 2时，如果你遇到在使用van-slider组件模仿视频进度条时，旋转90度后失效的问题，这通常是由于CSS变换（transform）导致的布局或事件处理的问题。以下是一个基本的示例代码，展示了如何使用van-slider（来自Vant库）并尝试解决旋转90度后失效的问题。

首先，确保你已经安装了Vant库，并在项目中正确引入。

安装Vant

npm install vant --save

引入Vant组件

在你的Vue组件中引入van-slider：

import Vue from 'vue';
import { Slider } from 'vant';

Vue.use(Slider);

组件模板和样式

接下来，在组件的模板和样式中设置van-slider，并尝试旋转它：

<template>
  <view class="container">
    <van-slider v-model="currentValue" @change="onSliderChange" class="custom-slider"/>
  </view>
</template>

<script>
export default {
  data() {
    return {
      currentValue: 50
    };
  },
  methods: {
    onSliderChange(value) {
      console.log('Slider value:', value);
    }
  }
};
</script>

<style scoped>
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  background-color: #f5f5f5;
}

.custom-slider {
  width: 100px;
  height: 4px;
  transform: rotate(90deg);
  transform-origin: left bottom; /* 根据需要调整旋转原点 */
  margin: 20px;
}

/* 由于旋转后高度变为宽度，需要重新设置触摸区域 */
.van-slider__bar {
  height: 100px !important; /* 旋转后的宽度 */
  width: 4px !important; /* 旋转后的高度 */
}

.van-slider__button {
  width: 16px !important; /* 旋转后按钮的宽度 */
  height: 16px !important; /* 旋转后按钮的高度 */
  left: -8px !important; /* 根据需要调整按钮位置 */
  top: calc(50% - 8px) !important; /* 垂直居中 */
}
</style>

注意点

1. 旋转原点：transform-origin属性决定了旋转的中心点，需要根据你的布局需求进行调整。
2. 触摸区域：旋转后，原来的宽度和高度会互换，因此你需要调整.van-slider__bar和.van-slider__button的样式来确保触摸区域正确。
3. 事件处理：如果旋转后滑动事件失效，可能是因为触摸事件的位置计算不正确。上述示例通过调整CSS来尝试解决这个问题，但在某些复杂布局中，可能需要额外的JavaScript代码来处理触摸事件。

这个示例提供了一个基本的框架，你可能需要根据实际情况进行进一步的调整和优化。