收藏
回答

请问movable-view中文字怎么换行?

//wxml
<block wx:for="{{message}}" wx:key="_id">
  <movable-area >
      <movable-view class="movable-view" direction="horizontal" inertia="true"  damping="100">
          <view class="list">
            <view class="text">
              <view class="theme">{{item.articleTitle}}</view>
            </view>
            <view class="pic">      
              <image class="img" mode="aspectFill" src="{{item.picture}}"/>
            </view>
          </view>
          <view class="delete" bindtap="delMes">删除</view>
      </movable-view>
  </movable-area>
</block> 


//css
movable-area{
  width95vwheight140rpx; 
  margin-right: -24rpx; 
  white-space: nowrap;
 }
  
  .movable-view{
  width120vw;
  height140rpx;
  display: flex;
  justify-content: space-between;
 }
    
   .movable-view .list{
      display: flex;
      width100vw;
   }
    
    .movable-view .list .text{
      width70vw; 
      height140rpx;
      position: absolute;
      right20vw;
      display: flex;
    }
    
     .list .theme{
      width100%;
      font-size40rpx;
      height140rpx;
      width70vw;
      font-weight550;
      padding10rpx;
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    } 
     
    .list .pic{ display: flex; width30vwheight140rpx;}
    .list .img{  width:100%height100%;}
  
  .delete{
  width20vw;
  background-color: red;
  color:  white;
  display: flex;
  align-items: center;
  justify-content: center;
}
回答关注问题邀请回答
收藏

1 个回答

  • Demons
    Demons
    2023-05-20

    请具体描述问题出现的流程,并提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。

    2023-05-20
    有用
    回复 1
登录 后发表内容