navigator+hover-class+小程序路由
1.实现效果
文章图片
2.navigator属性
navigator的open-type属性 可选值 'navigate'、'redirect'、'switchTab'，对应于wx.navigateTo、wx.redirectTo、wx.switchTab的功能
open-type="navigate"等价于API的 wx.navigateTo 而wx.navigateTo的url是需要跳转的应用内非 tabBar 的页面的路径
open-type="redirect"等价于API的 wx.redirectTo 而wx.redirectTo的url是需要跳转的应用内非 tabBar 的页面的路径
open-type="switchTab"等价于API的 wx.switchTab而wx.switchTab的url是需要跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面。
3.hover-class属性
微信小程序中，可以用 hover-class 属性来指定元素的点击态效果。但是在在使用中要注意，大部分组件是不支持该属性的。
目前支持 hover-class 属性的组件有三个：view、button、navigator。
文章图片
tips：
1.当 hover-class 的值为 none 时，组件上不会有任何点击态效果。
2.当指定了其他类的时候，与 hover-class产生 冲突，若想保留hover-class的效果，需要将hover-class的类写在最下面，并且适当的使用!important来增加权重。
4.小程序路由
文章图片
区别：
wx.navigateTo ：
保留当前页面、跳转到应用内的其他页面，对于页面不多的小程序，通常推荐使用 wx.navigateTo进行跳转， 便于返回原页面，反之则不推荐使用。
wx.redirectTo ：
页面栈到达5 层，应该考虑选择 wx.redirectTo。关闭当前页面，跳转到应用内的某个页面。避免跳转前页面占据运行内存，但返回时页面需要重新加载
wx.reLaunch ：
与 wx.redirectTo()的用途基本相同，先关闭了内存中所有保留的页面，再跳转到目标页面。它也能实现从非 tab bar 跳转到 tab bar，或在 tab bar 间跳转，效果等同 wx.switchTab()。
wx.switchTab ：
跳转到 tab bar 的页面，关闭所有非 tab bar 的页面。使用其他跳转 API 来跳转到 tab bar，则会跳转失败。
【navigator+hover-class+小程序路由】wx.navigateBack：
关闭当前页面，并返回上一页面或多级页面。可通过 getCurrentPages() 获取当前的页面栈，决定需要返回几层。这个 API 需要填写的参数只有 delta，表示要返回的页面数。若 delta 的取值大于现有可返回页面数时，则返回到用户进入小程序的第一个页面。当不填写 delta 的值时，就默认其为 1，返回上个页面。
推荐阅读
- 一个小故事，我的思考。
- 家乡的那条小河
- 一个人的碎碎念
- 野营记-第五章|野营记-第五章 讨伐梦魇兽
- 昨夜小楼听风
- 2021-02-17|2021-02-17 小儿按摩膻中穴-舒缓咳嗽
- 基于微信小程序带后端ssm接口小区物业管理平台设计
- 2019.4.18感恩日记
- 那件我们忽略的小事叫感恩
- 你有婚内虐待行为吗（）