发现View 容器的flex-direction属性对容器内部是Text的组件不起作用,模拟器和真机上都是如此,发现如下现象:1、将Text换成RichText后模拟器不起作用,但真机下可以 2、将内部组件Text也全部换成容器View 模拟器和真机下都可以。
代码如下
.wxml
<view class=“container1”>
<view class=“subcontainer1”>
<view class=“item1”>
<view class=“item11”><text>纬度</text> <text>30.234</text></view>
</view>
<view class=“item1”>
<view class=“item11”><text>经度</text> <text>103.034</text></view>
</view>
<view class=“item1”>
<view class=“item11”><text>速度</text> <text>60km</text></view>
</view>
</view>
<view class=“subcontainer1”>
<view class=“item1”>
<view class=“item11”><text>方向</text> <text>230</text></view>
</view>
<view class=“item1”>
<view class=“item11”><text>GPS时间</text> <text>2017-07-17 10:34:23</text></view>
</view>
<view class=“item1”>
<view class=“item11”><text>状态时间</text> <text>2017-07-17 10:24:23</text></view>
</view>
</view>
</view>
.wxss
.container1{
height: 100%;
width:100%;
background-color:beige;
display:flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: center;
}
.subcontainer1{
height: 50%;
width:100%;
background-color:beige;
display:flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: center;
}
.item1{
height:100rpx;
width:300rpx;
background-color:cyan;
border: 1px solid #fff;
}
.item11{
flex-direction: column;
}
实际效果
希望达到效果