微信小程序中text設置line-height不起作用的解決方法

最近在研究微信小程序開發，在學習慕課網上連勝老師的《入門微信小程序開發》課程裏，遇到一個問題，給text設置line-height爲1的時候不起作用

頁面代碼如下

 <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
  <block wx:for="{{imgUrls}}">
    <swiper-item>
      <image src="{{item}}" class="slide-image" width="355" height="150" />
    </swiper-item>
  </block>
</swiper>
<view class='iems-list'>
  <view class='pro-item' wx:for="{{proList}}">
    <image class='pro-logo' src='{{item.img}}'></image>
    <view class='pro-body'>
      <view class='pro-title'>{{item.title}}</view>
      <text class='pro-desc'>{{item.shortDesc}}</text>
      <view class='pro-footer'>
        <image class='btn-detial' src='/images/btn_detail.png'></image>
        <image class='btn-ask' src='/images/btn_ask.png'></image>

      </view>
    </view>
  </view>
</view>

text樣式如下

.pro-desc{
  color: #9a9a0a;
  font-size: 28rpx;
  line-height: 0.8;
}

解決方法
在text標籤外套上一層view
如下：

 <view class='pro-desc-container'>
      <text class='pro-desc'>{{item.shortDesc}}</text>
 </view>

line-height作用於view上
樣式如下：

.pro-desc-container{
   line-height: 1;
}
.pro-desc{
  color: #9a9a0a;
  font-size: 28rpx;
  line-height: 0.8;
}

最後效果