滚动 pageScrollTo

. 实现页面或部分内容的滚动

wx.pageScrollTo(Object object)

将页面滚动到目标位置，支持选择器和滚动距离两种方式定位；2选1
深层嵌套中，配合 wx.createSelectorQuery() 获取节点信息，实现更精确的滚动定位

pageScrollTo常用属性
item	desc
scrollTop	滚动到页面的目标位置；单位 px
duration	滚动动画时长；单位 ms；默认300
selector	选择器；仅仅支持ID、类、后代、并列等基本选择器
offsetTop	偏移距离，需要搭配 selector 参数使用，可以滚动到 selector 加偏移距离的位置，单位 px

[] 返回顶部 - 到页面0的位置；使用距离

将某个元素固定定位 - fixed 在页面底部并绑定事件

wx.pageScrollTo({
    scrollTop: 0,
    duration: 300,
    success: res => console.log(res),
    fail: err => console.log(err),
    complete: () => console.log('scroll done')
})

[] 页面滚动到某个元素 - 使用选择器

页面结构 wxml

<view class="wrap">
    <view class="header"></view>
    <view class="nav"></view>
    <view class="cont"></view>
    <view class="footer"></view>
    <view class="backToNav" bind:tap="toNav">返回主菜单</view>
</view>

页面逻辑 js

toNav(){
    wx.pageScrollTo({
        selector:'.nav',
        // offsetTop: 100, // 返回到距离元素顶部100px的位置
        duration: 300,
        success: res => console.log(res),
        fail: err => console.log(err),
        complete: () => console.log('scroll done')
    })
}

[] 美食地图 - 增加导航菜单，分类美食，单击菜单跳转到对应的分类