有没有办法让这个动画从停止的地方重新开始？动漫.js

如何解决有没有办法让这个动画从停止的地方重新开始？动漫.js

我试图让下面的 onclick 函数在我们每次点击方块时从它停止的地方执行。例如，第一次点击时，绿色方块移动到左下角。下一次点击它应该旋转到右上角等等。有什么办法可以做到这一点吗？

（目前，点击后，它会从头开始重新启动）

var rotate = anime({
  targets: '.Box',rotate: '0.5turn',autoplay: false

})


document.querySelector('#Box').onclick = rotate.play

.Box {
  height: 400px;
  width: 400px;
  border: 5px solid black;
  margin: 20px auto;
  display: flex;
  flex-wrap: wrap;
  /* overflow: hidden; */
}

.item1,.item2,.item3,.item4 {
  width: 200px;
  height: 200px;
}

.item1 {
  background-color: cadetblue;
}

.item2 {
  background-color: chartreuse;
}

.item3 {
  background-color: cornflowerblue;
}

.item4 {
  background-color: crimson;
}

<html>

<head>
  <link rel="stylesheet" href="style.css">
</head>

<body>

  <div id="Box" class="Box">
    <div class="item1"></div>
    <div class="item2"></div>
    <div class="item3"></div>
    <div class="item4"></div>

  </div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/animejs/3.2.1/anime.min.js" integrity="sha512-z4OUqw38qNLpn1libAN9BsoDx6nbNFio5lA6CuTp9NlK83b89hgyCVq+N5fdbJptINztxn1Z3SaKSKUS5UP60Q==" crossorigin="anonymous"></script>
  <script src="script.js"></script>
</body>

</html>

有没有办法让这个动画从停止的地方重新开始？ 动漫.js

如何解决有没有办法让这个动画从停止的地方重新开始？ 动漫.js

有没有办法让这个动画从停止的地方重新开始？动漫.js

如何解决有没有办法让这个动画从停止的地方重新开始？动漫.js