.view-item {
text-align: center;
padding: 10px;
background-color: burlywood;
border-radius: 5px;
margin: 20px;
}
index.js
clickMe:function(e) {
// 通过dataset来将wxml中的数据给传递过来
console.log(e.currentTarget.dataset)
count++
this.data.clickmsg = ‘点击了’ + e.currentTarget.id + ‘当前已经点击了’ + count + ‘次’
// 必须要这样写才能更新数据
this.setData(this.data)
}
注意: 我们可以通过dataset来将wxml中的数据给传递过来,其中的age和name都是在wxml中设置的,命名规范必须是data-xxx,如果我们要取具体的某个值(例如name),可以使用
console.log(e.currentTarget.dataset.name)
:
页面跳转共有两种方式
clickMe(e) {
wx.redirectTo({
url: ‘…/home/home’
})
}
clickMe(e) {
wx.navigateTo({
url: ‘…/home/home’
})
}
两者的区别:
-
wx.navigateTo
的执行: -
假使我们从A页面跳转到home页面,再从home页面跳转到user,再从user页面返回,日志打印如下:
home会依次执行onload—onshow—onready,当页面从home跳转到user时,会先调用home的onhide,然后加载user,执行onload—onshow—onready.当从user返回时,user页面会销毁,执行user的onUnload,然后home的页面出现,执行home的onshow
wx.redirectTo
:
与wx.navigateTo的区别在于,当从home跳转到user时,会执行home的onUnload的方法,实际是home在跳转时被销毁了,"替换"成了user的页面,当从user返回时,不再返回的是home页面,而是原来home的上一级页面.
tabbar之间的切换来实现跳转
tabbar的切换与iOS的tabbar十分相似.假使home和user两个page分别为tabbar的两个模块,且默认选中home,当小程序启动后,我们从点击user,再点击home,可以看到如下日志:
小程序启动后,会执行home的onLoad----onshow—onready函数,当我们点击tabbar切换到user时,会先执行home的onhide,然后再执行user的onLoad----onshow—onready函数;当我们再次点击tabbar切换home时,会执行user的onhide,再执行home的onshow.说明:此时页面中home和user同时存在,点击哪个显示哪个执行onshow(当然是指不是第一次加载的情况),原先显示的将执行onhide来隐藏自己.
在.wxml中实现页面的跳转
导航组件跳转到User
如果是想通过redirect方式跳转,只需要在navigate组件后声明即可:
导航组件跳转到User
## 最后小编这些年深知大多数初中级Android工程师,想要提升自己,往往是自己摸索成长,自己不成体系的自学效果低效漫长且无助。
因此我收集整理了一份《2024年Android移动开发全套学习资料》,初衷也很简单,就是希望能够帮助到想自学提升又不知道该从何学起的朋友。
由于文件比较多,这里只是将部分目录截图出来,全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频,并且后续会持续更新
一个人可以走的很快,但一群人才能走的更远!不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人
都欢迎加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!
如果你需要这些资料, ⬅ 专栏获取
比较多,这里只是将部分目录截图出来,全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、电子书籍、讲解视频,并且后续会持续更新
一个人可以走的很快,但一群人才能走的更远!不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人
都欢迎加入我们的的圈子(技术交流、学习资源、职场吐槽、大厂内推、面试辅导),让我们一起学习成长!
如果你需要这些资料, ⬅ 专栏获取