做了一個簡單的小程式箭頭旋轉動畫效果。

 <view class='clist fs26' bindtap='godet'>
      <view> 專案名稱：萌卡納</view>
       <view class='f-r '> 
        {{item.show==true?"收起":"詳情"}}
       <view class='cimg {{show==true?"xz180":""}}'>
        <image mode='aspectFill' src='../../icon/xia.png'></image>
       </view>
       </view>
 </view>
 

.clist{
  width: 100%;
  height: 50rpx;
  padding: 10rpx 20rpx;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #393F59;
  color: white;
}
.cimg{
  width: 30rpx;
  height: 30rpx;
  padding: 10rpx;
  transition: All 0.4s ease-in-out;
  }
  .cimg image{
    width: 100%;
    height:100%;
  }
  .xz180{
    transform: rotate(180deg);
  }
.f-r{
  display: flex;
  justify-content: center;
  align-items: center;
}
 

// pages/customer/customer.js
Page({

  /**
   * 頁面的初始資料
   */
  data: {
   
       show: false
      
  },

  /**
   * 生命週期函式--監聽頁面載入
   */
  onLoad: function (options) {

  },
  godet:function(e){
    that.setData({
      show:!that.data.show
    })
  },
  /**
   * 生命週期函式--監聽頁面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命週期函式--監聽頁面顯示
   */
  onShow: function () {

  },

  /**
   * 生命週期函式--監聽頁面隱藏
   */
  onHide: function () {

  },

  /**
   * 生命週期函式--監聽頁面解除安裝
   */
  onUnload: function () {

  },

  /**
   * 頁面相關事件處理函式--監聽使用者下拉動作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 頁面上拉觸底事件的處理函式
   */
  onReachBottom: function () {

  },

  /**
   * 使用者點選右上角分享
   */
  onShareAppMessage: function () {

  }
})