小程序界面布局出现滚动条、滚动组件的坑、flex布局的坑

刚接触小程序不久，在公司琢磨了好久，发现了几个小程序的坑。
1.界面中明明设置了overflow:hidden和高度：100%，结果在真机测试的时候，界面就是出现滚动条的情况。

这种情况需要在加一个page样式：

page{
  overflow: hidden;
  height: 100%;
}

这样就能解决问题了。

2.使用scroll-view组件的时候，总是显示不齐所有的内容，这是由于对于scroll组件，我们都是设置了固定的高度，和overflow:hidden的样式，如果要显示齐所有的内容，需要在scroll组件增加一个view容器，对这个容器设置样式为padding-bottom：高度，注意：margin-bottom在苹果机的时候会出现问题，

<block wx:for="{{7}}" wx:key="index">
	<view class="hot-job" bindtap="tapList">
		<view class="job">
			<view>资深销售总监</view>
			<view>千叶科技</view>
		</view>
		<view class="wages">
			<view>13K-15K/月</view>
			<view>匹配度 94%</view>
		</view>
	</view>
</block>
<view style="padding-bottom:120rpx">
</view>

3.如果在page页面中，注册组件，需要在page页面对应的容器中，设置width:100%|| height:100%,
因为组件设置的百分比，并且用了display：flex布局，所以需要在引用的组件的块中增加百分比的设置，否则样式会出现问题。

page样式：

.hot-company{
  /* margin-top: 10rpx; */
  margin-left: 40rpx;
  width: 100%;
  white-space: nowrap;
}

组件/样式样式：
hot-person.wxml

<block wx:for="{{7}}" wx:key="index">
	<view class="hot-job" bindtap="tapList">
		<view class="job">
			<view>资深销售总监</view>
			<view>千叶科技</view>
		</view>
		<view class="wages">
			<view>13K-15K/月</view>
			<view>匹配度 94%</view>
		</view>
	</view>
</block>
<view style="padding-bottom:120rpx">
</view>

hot-person.wxss

.hot-job {
  width: 100%;
  height: 140rpx;
  display: flex;
  flex-direction: row;
  background-color: #fff;
  margin-top: 30rpx;
  position: relative;
  z-index: 2;
}