⼩程序-view（视图容器）
⽰例
写文章的小程序<view class="section">
<view class="section__title">flex-direction: row</view>
<view class="flex-wrp" >
<view class="flex-item bc_green">1</view>
<view class="flex-item bc_red">2</view>
<view class="flex-item bc_blue">3</view>
</view>
</view>
<view class="section">
<view class="section__title">flex-direction: column</view>
<view class="flex-wrp" >
<view class="flex-item bc_green">1</view>
<view class="flex-item bc_red">2</view>
<view class="flex-item bc_blue">3</view>
</view>
</view>
⽰例讲解
学过HTML的童靴很容易看懂上⾯的代码。没⽤过这种标签语⾔的，其实也很容易看懂。稍微讲解⼀下：
1.单个的view
<view class="section">
</view>
这就是⼀个单个的视图。“section”则是写在.wxss⽂件中的样式，容器的样式决定它的形状、颜⾊、位置等属性。例：
.section{
position: absolute;
top: 28rpx;
right: 44rpx;
width: 32rpx;
height: 32rpx;
}
2.⽗容器和⼦容器的嵌套
<view class="flex-wrp" >
<view class="flex-item bc_green">1</view>
<view class="flex-item bc_red">2</view>
<view class="flex-item bc_blue">3</view>
</view>
⼀个⽗容器中有三个⼦容器。
给视图容器绑定点击事件
⽰例
<view class="widgets__item" bindtap="tapToNext">
</view>
关键点是 bindtap="tapToNext"，这就绑定了⼀个点击事件，响应事件的函数名是tapToNext。这个函数在.js⽂件中。形如
tapToNext:function(event){
console.log(event)
wx.navigateTo({
url: '../logs/logs'
})
}
点击后界⾯跳到⼀个名为logs的Page。
关于事件的详细讲解见

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。