image组件高度问题,显示好恶心?
js文件
Page({
data: {
has:[
{title:'产品1',num:5,sendNum:0},
{ title: '产品2', num: 5, sendNum: 0 },
{ title: '产品3', num: 5, sendNum: 0 },
{ title: '产品4', num: 5, sendNum: 0 },
]
},
onLoad: function (options) {
}
})
wxml文件
<view class="page">
<view class="session">
<view class="ss-title">选择配送产品</view>
<view class="flex-item3">
<view class="item3-list" wx:for="{{has}}" wx:key="index">
<view class="list-left">{{item.title}}</view>
<view class="list-mid">{{item.num}}</view>
<view class="list-right">
<view class="num-item">
<image class="item-icons" src="../../assets/icon/dec.png" mode="widthFix"></image>
<view class="num-item-num">{{item.sendNum}}</view>
<image class="item-icons" src="../../assets/icon/inc.png" mode="widthFix"></image>
</view>
</view>
</view>
</view>
</view>
</view>
wxss文件
.session{
background: #fff;
padding: 10px;
}
.ss-title{
text-align: center;
border-bottom: 1px solid #f3f3f3;
margin: 10px;
}
.item3-list{
display: flex;
color: #555555;
border-bottom: 1px solid #f1f1f1;
}
.list-left{
flex: 2;
padding:5px;
line-height: 25px;
}
.list-mid{
flex: 1;
padding: 5px;
line-height: 25px;
text-align: center;
}
.list-right{
flex: 1;
padding: 5px;
height: 25px;
line-height: 25px;
text-align: center;
}
.num-item{
display: flex;
}
.item-icons{
width: 100%;
flex: 1
}
.num-item-num{
line-height: 25px;
flex: 2;
text-align: center;
}
显示出来是这样的,这样看好像没什么问题
问题来了。。。。。
两个样式是一样的,给它设定高度25px了,编译出来的一个22px,一个21px
一脸懵逼。。。。。。太TMD恶心了!
求解!