小程序干货系列----单机导航栏滚动到页面对应的位置俗称抛锚

大家都知道在html中抛锚直接使用a标签就可以了，但是小程序没有a标签，只有navigator标签。这可咋办呢？

这个时候就要使用小程序的标签了。
这个标签里面有个属性是scroll-into-view=”“(此空填写你要跳转到的地方的id)

wxml内容

<scroll-view scroll-into-view='position' scroll-y='true' scroll-with-animation="true">
    <view id="list1">
        ...超级多的内容....
    </view>
    <view id="list2">
        ...超级多的内容....
    </view>
    <view id="list3">
        ...超级多的内容....
    </view>
</scroll-view>
<button bintap='toList2'></button>

js内容：

toList2:function(){
    this.setData({
        position:'list2'
    })
}

需要注意的地方：
1.page高度100%
2.scroll-view高度100%
3.scroll-into-view跳转到对应的位置
4.scroll-y开启滚动设置
5.scroll-with-animation开启之后丝般顺滑

参考文章：

http://blog.csdn.net/h357650113/article/details/78383175?utm_source=debugrun&utm_medium=referral

干活系列项目地址：
码云：https://gitee.com/mrxu314/xcx_gh
gitHub：https://github.com/mrxu0/xcx_gh
希望这篇文章能够帮助到你们
欢迎大家关注我的公众号吵吵日记：