vue，requestAnimationFrame动画设置为30fps

如果您想要将Vue动画设置为每秒30帧，您可以使用requestAnimationFrame（RAF）方法和Vue的transition组件。在Vue的transition组件中，您可以使用CSS或JS动画来定义动画效果。在JS动画中，您可以使用RAF方法来控制动画的帧率。

以下是一个示例代码，可以将Vue动画设置为每秒30帧：

<template>
  <transition @enter="startAnimation">
    <div :style="{ transform: `translateX(${x}px)` }"></div>
  </transition>
</template>

<script>
export default {
  data() {
    return {
      x: 0,
      lastTime: 0,
    };
  },
  methods: {
    startAnimation() {
      this.lastTime = performance.now();
      requestAnimationFrame(this.animate);
    },
    animate(now) {
      const deltaTime = now - this.lastTime;
      if (deltaTime > 33.33) {
        this.x += 1;
        if (this.x > 100) {
          this.x = 0;
        }
        this.lastTime = now;
      }
      requestAnimationFrame(this.animate);
    },
  },
};
</script>

在上面的代码中，我们使用了Vue的transition组件来包装一个div元素，并在enter事件中启动动画。在动画开始时，我们使用performance.now()方法记录当前时间，然后在RAF回调函数中计算出两次调用之间的时间差，如果时间差大于33.33毫秒（即每秒30帧），则更新x的值，并将lastTime设置为当前时间。最后，我们使用requestAnimationFrame()方法递归调用animate()方法，以便在每一帧中更新x的值。

请注意，这只是一个简单的示例代码，您需要根据自己的需求进行修改。