效果图

wxml

<view style="display: flex;background: #fff;padding: 25rpx;align-items: center;">
     <view class="dot1"> </view>
     <view class="dot2"></view>
     <view class="dot3"></view>
</view>

css

.dot1, .dot2, .dot3 {
    width: 10rpx;
    height: 10rpx;
    border-radius: 50%;
    margin: 10rpx;
}

.dot1 {
    animation: jump 1.6s -0.32s linear infinite;
    background: #ccc;
}
.dot2 {
    animation: jump 1.6s -0.16s linear infinite;
    background: #ccc;
}
.dot3 {
    animation: jump 1.6s linear infinite;
    background: #ccc;
}

@keyframes jump {
    0%, 80%, 100% {
        -webkit-transform: scale(0);
        transform: scale(0);
    } 
    40% {
          -webkit-transform: scale(2.0);
          transform: scale(2.0);
      }
}