在做隐藏view之前,我们可以先来了解一下微信小程序视图层的事件。
官方文档 事件 | 微信开放文档
什么是事件?
- 事件是视图层到逻辑层的通讯方式。
- 事件可以将用户的行为反馈到逻辑层进行处理。
- 事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数。
- 事件对象可以携带额外信息,如 id, dataset, touches。
事件的使用方式
- 在组件中绑定一个事件处理函数。
如bindtap
,当用户点击该组件的时候会在该页面对应的 Page 中找到相应的事件处理函数。
<view id="tapTest" data-hi="Weixin" bindtap="tapName"> Click me! </view>
- 在相应的 Page 定义中写上相应的事件处理函数,参数是event。
Page({
tapName: function(event) {
console.log(event)
}
})
首先我们先创建一个view,它需要包裹两个子view:一个为我们触发事件并可视的view ,另一个为隐藏的view。当我们点击可视的view,则会在下面弹出隐藏的view。
WXML
WXSS
js
我们可以在控制台看到showIndex的值的变化
如果想要添加多个隐藏的view,只需要更改可视view中的data-index的值,还有隐藏view的showIndex的值 文章来源:https://www.toymoban.com/news/detail-434492.html
文章来源地址https://www.toymoban.com/news/detail-434492.html
到了这里,关于微信小程序view的折叠与展开的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!