小程序点击按钮隐藏view并显示另个view
温馨提示:
最后更新时间2018-08-28 15:07:10,若内容或图片失效,请留言反馈!
在wxml按钮绑定一个点击事件,然后在wxss中设置一个view显示和一个view隐藏,在js定义一个数据,初始值为true,然后将数据绑定到两个view里面,用三元运算来判定后添加class,这个class就是显示或隐藏view,如果要隐藏的可以判断showView为true是加上hide的class,如果要隐藏的可以判断showView为true是加上show的class,最后点击按钮的是把showView的值改为false就可以了
wxml:
<view class="one {{showView?'show':'hide'}}" ><image src='../../img/timg.jpg'></image><button class='show-button' bindtap='showButton'>go</button></view><view class="two {{showView?'hide':'show'}}"><image src='../../img/timg.gif'></image></view>
wxss:
.hide{display: none;}.show{display: block;}
js:
data: {showView: true,},showButton:function(){var that = this;that.setData({showView: (!that.data.showView)})
文章版权声明:除非注明,否则均为林羽凡原创文章,转载或复制请以超链接形式并注明出处。