uniapp中使用requestAnimationFrame

在uni-app中使用requestAnimationFrame可以通过uni.createSelectorQuery()来获取页面元素的高度和位置信息，然后使用requestAnimationFrame来实现动画效果。

具体步骤如下：

1. 在需要使用requestAnimationFrame的页面中，引入uni.createSelectorQuery()方法。

2. 使用uni.createSelectorQuery()方法获取需要进行动画操作的页面元素的高度和位置信息。

3. 在获取到元素信息后，使用requestAnimationFrame来实现动画效果。

例如，以下代码实现了一个简单的动画效果，当用户点击按钮时，页面元素会向上移动50像素：

<template>
  <view class="demo">
    <view class="box" :style="{top:top + 'px'}"></view>
    <button @click="move">移动</button>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        top: 0
      }
    },
    methods: {
      move() {
        uni.createSelectorQuery().select('.box').boundingClientRect(res => {
          let start = Date.now(),
              duration = 500, //动画持续时间
              from = this.top, //起始位置
              to = res.top - 50; //目标位置

          function step() {
            let progress = Math.min(1, (Date.now() - start) / duration);
            this.top = from + (to - from) * progress;
            if (progress < 1) {
              requestAnimationFrame(step);
            }
          }

          requestAnimationFrame(step);
        }).exec();
      }
    }
  }
</script>

在上面的代码中，我们首先使用uni.createSelectorQuery()方法获取了页面中class为box的元素的位置信息，然后在move()方法中使用requestAnimationFrame来实现动画效果，具体实现可以参考step()函数中的代码。

需要注意的是，在使用requestAnimationFrame时，我们需要根据动画持续时间来计算出每一帧动画的位置，这样才能实现平滑的过渡效果。