天天看点

微信小程序使用scroll-view进行锚点定位

  1. 使用scroll-view进行锚点定位,索要跳转的元素,必须包含在这个组件里边,也就是最外层是scroll-view;
  2. 使用scroll-y 和 scroll-into-view 这两个属性,必须让 scroll-into-view组件内部的子元素 的 id 值等于 scroll-into-view 的值;
  3. 一定要给scroll-view设置一个高度,或者 100%

wxml

<view>
	<view datatap="clickHandler">点击跳转id=food1</view>
	<view>点击跳转id=food2</view>
	<view>点击跳转id=food3</view>	
</view>

 <scroll-view scroll-y="true" scroll-into-view="{{jumpPoint}}" bindscroll="onClick_scroll">
	<div id="food1"></div>
	<div id="food2"></div>
	<div id="food3"></div>
 </scroll-view>
           

js

Page({
	data:{
		jumpPoint:'',//跳转锚点
	},

	clickHandler(){//这只是个例子
		this.setData({
			jumpPoint='food1'
		})
	}
})