vue js如何控制图片旋转

我们可以通过使用CSS的transform属性来控制图片的旋转，在Vue.js中，我们可以通过绑定样式来控制图片的旋转。例如，将一个图片绑定一个动态的旋转角度变量rotate，如下所示：

<template>
  <img :src="imgSrc" :style="{transform: 'rotate(' + rotate + 'deg)'}" />
</template>

<script>
export default {
  data() {
    return {
      imgSrc: '图片地址',
      rotate: 0 // 初始化旋转角度为0
    }
  },
  methods: {
    //点击按钮旋转图片
    rotateImg() {
      this.rotate += 90; // 旋转角度每次增加90度
    }
  }
}
</script>

在上面的代码中，我们将样式绑定到了img的style属性上，使用了dynamic class和v-bind指令。每次点击按钮rotateImg方法会更新rotate变量的值，从而实现图片随着按钮的点击逐渐旋转90度的效果。