微信小程序中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;
}

最后效果