<scroll-view class="scroll-view_H" scroll-x="true">
<view class="scroll-view-item_H" wx:for="{{weatherweek.data}}">
<view>{{item.date}}</view>
<view>{{item.tem2}}~{{item.tem1}}</view>
<view class='wea'>{{item.wea}}<image class='wea_img' src='../../weaicon/{{item.wea_img}}.png'></image></view>
<view>{{item.win[0]}}{{item.win_speed}}</view>
</view>
</scroll-view>
<!-- 描述 -->
<view class="detail">
<view class="item">
<text>温度(℃)</text>
<text>{{weather.tem}}</text>
</view>
<view class="item">
<text>湿度(%)</text>
<text>{{humidity}}</text>
</view>
<view class="item">
<text>PM2.5</text>
<text>{{weather.air_pm25}}</text>
</view>
<view class="item">
<text>气压(hPa)</text>
<text>{{weather.pressure}}</text>
</view>
<view class="item">
<text>风向</text>
<text>{{weather.win}}</text>
</view>
<view class="item">
<text>风速</text>
<text>{{weather.win_meter}}</text></view>
<view class="item">
<text>风速等级</text>
<text>{{weather.win_speed}}</text>
</view>
<view class="item">
<text>能见度</text>
<text>{{weather.visibility}}</text>
</view>
<view class="item">
<text>风力</text>
<text>{{weather.win_speed}}</text>
</view>
<view class="item">
<text>小时空气</text>
<text>{{weather.hours}}</text>
</view>
</view>
感想:
今天的任务依然是在天气预报页面的基础上添加相关的应用和功能。实现可以定位,对该位置进行天气预报的查询,以及设计出其他辅助的显示页面。在掌握了相关的用法之后,我们要力求追求页面的精美,不要使得小程序的页面过于呆板。