<view class="box">
        <!-- 第一节课 -->
        <view class="big1box">
          <!-- 第一个小盒子的小盒子 -->
          <view class="bigbig1box">{{item.HourID==3 ? '13:10' : '15:00'}}</view>
          <view class="bigbig2box">{{item.HourID==3 ? '14:40' : '16:30'}}</view>
        </view>
        <view class="xian"></view>
        <view class="big2box">
            <!-- 第一个小盒子的小盒子 -->
          <view class="bigbig3box">{{item.Course}}</view>
          <view class="bigbig4box">第{{item.HourID}}节 {{item.Course=='体育' ? '体育场':item.classroom}}</view>
        </view>
        <view class="big3box">已结束</view>
      </view>



.box{
  display: flex;
  height:160rpx;
  border: 1rpx solid rgba(187, 187, 187, 100);
  padding:20rpx 10rpx;
  margin:15rpx 0rpx;
  border-radius: 20rpx;
  transform: rotateX(360deg);
  animation: boxaction 1s ;
}
@keyframes boxaction {
  0%{
    transform: rotateX(0deg);
  }
  100%{
    transform: rotateX(360deg);
  }
}

下面的方框都有一个翻转动作，这是用wxss实现的动画，我先就是通过每一次切换到这个页面都会执行这个动画，但是现在编译以后的第一次才会出现
这个动画，如果切换到其他页面再切换到这个页面，它这个动画也不执行。不知道怎么解决？希望可以帮帮忙！十分感谢