wx 小程序动画让图片一直匀速旋转

html

<div>
            <image animation="{{animationData}}" src="http://school-hi.oss-cn-shanghai.aliyuncs.com/markettest/1600330381592_453.png?Expires=1631866382&OSSAccessKeyId=LTAInVG6zkrEMhpe&Signature=p88AO31rMAKPn%2Fr0xyLicsZIWjo%3D" />
</div>

js

data: {
            rotateIndex: 1,
            animationData: {}
        },
        ready() {
            // 创建动画
            var animation = wx.createAnimation({
                duration: 1000,
                timingFunction: "linear"
            })
            this.animation = animation
            // 执行旋转或者点击图片旋转(如果你想要点击就在图片上添加点击事件我默认是添加的)
            this.refreshList()
        },
        methods: {
            /**
             * 动画
             */
            refreshList() {
                this.timeInterval = setInterval(function () {
                      this.rotateIndex = this.rotateIndex+1;
                      this.animation.rotate(180 * (this.rotateIndex-1)).step()
                      this.animationData = this.animation.export()

                }.bind(this), 1000)
                // 请求API接口或者别的操作
                this.request()
            },
            // 停止旋转
            stopRefresh() {
                if (this.timeInterval > 0) {
                    clearInterval(this.timeInterval)
                    this.timeInterval = 0
                }
            },

        }