所谓导航到某个页面，就是跳转到某个页面，但是其会保留当前页面，跳转的目的页面导航栏左侧中自带一个返回按钮，点击可以回到之前的页面，但是这个跳转的目的页面不能是tabbar中的页面，其使用的是wx.navigateTo({})
wx.navigateTo({ url: "../myLesson/main" // 导航到我的课程页面，目标页面自带返回按钮，点击可返回之前的页面 });
⑨ 动态设置页面导航栏标题
当我们点击列表中的某个具体项时，通常需要在其对应页面动态显示出当前点击项的具体导航栏标题，微信小程序提供了wx.setNavigationBarTitle({})用于动态设置导航栏栏标题，同样有success、fail、complete三个回调函数，如:
wx.setNavigationBarTitle({ title: "动态标题内容", success() { }, fail() { }, complete() { } });
⑩ 本地缓存数据
微信小程序提供了setStorage({})方法，可以将数据存储在本地缓存中指定的 key 中，除非用户主动删除或因存储空间原因被系统清理，否则数据都一直可用。单个 key 允许存储的最大数据长度为 1MB，所有数据存储上限为 10MB。如:
wx.setStorage({ key:"key", data:"value" });
同样，微信小程序也提供了getStorage({})方法，用于获取对应key中存储的数据，其还有success、fail、complete三个回调函数，如:
wx.getStorage({ key: "key", success (res) { // 成功获取到对应key中的数据 }, fail() { // 未成功获取到对应key中的数据 }, complete() { // 获取对应key数据结束，不管成功还是失败都会执行 } });
getStorage()和setStorage()方法本身是异步的，但是微信小程序提供了对应的同步方法，即getStorageSync("key")和setStorageSync("key", "value");
⑪ 轮播图组件
微信小程序提供了一个<swiper>轮播图组件，其中只可放置swiper-item组件，swiper有一些常用的属性，如:
indicator-dots: 是否显示面板指示点;
autoplay: 是否自动切换;
interval: 设置自动切换时间间隔;
duration: 滑动动画时长;
circular: 是否循环播放;
indicator-active-color: 设置当前选中的指示点颜色;
<swiper :indicator-dots="indicatorDots" :autoplay="autoPlay" :interval="interval" :duration="duration" :circular="circular" indicator-active-color="rgba(255,255,255, 0.6)"> <block v-for="(item, index) in imgUrls" :key="index"> <swiper-item> <img :src="item"/> </swiper-item> </block> </swiper>
当然，<swiper>组件不仅仅能实现图片的轮播，还可以实现其他轮播，比如列表内容的轮播(导航和内容的联动)，我们不给其添加indicator-dots、autoplay、interval、duration、circular等属性，而是通过手进行滑动，swiper组件还有一个current属性，属性值为滑动块的索引值，用于显示对应的滑动item，从而实现导航和内容的联动，即点击导航，自动切换到对应内容。swiper组件也提供了change事件，当我们手动滑动滑动item的时候，就会触发change事件，可以在事件对象中拿到对应滑块的索引，从而更新导航位置，实现滑动内容，自动高亮导航位置。
⑫ 可滚动区域组件
微信提供了一个<scroll-view>可滚动区域组件，用于设置该区域中的内容是可以滚动的，通常用于实现可滚动的导航标签栏，其常用属性为:
scroll-x: 是否允许横向滚动;
scroll-y: 是否允许纵向滚动;
scroll-into-view: 属性值为对应滚动item的id，表示自动滚动到对应id元素位置;
scroll-with-animation: 在设置滚动条位置时使用动画过渡;
要实现点击某个滚动item后，自动滚动到对应滚动item位置，那么需要给每个滚动item添加一个id，然后动态改变scroll-into-view的值为对应的滚动item的id即可。
<scroll-view scroll-x :scroll-into-view="toChildView" scroll-with-animation> <span :class="{active: currentIndex === index}" v-for="(item, index) in allLessons" :key="index" :id="item.id" @click="switchItem(index)"> {{item.name}} </span> </scroll-view>