uni-appはアンカージャンプメソッドを実装します

uniapp の uni.createSelectorQuery() メソッドを uni.pageScrollTo(OBJECT) メソッドと組み合わせて使用​​します。

詳しい使用方法については、公式ドキュメントを参照してください:
uni.createSelectorQuery() メソッド:  https://uniapp.dcloud.io/api/ui/nodes-info?id=createselectorquery
uni.pageScrollTo(OBJECT) メソッド:  https:// uniapp.dcloud .io/api/ui/scroll?id=pagescrollto

 

コアコード:

//从当前位置到达目标位置
uni.createSelectorQuery().select('.comment-content').boundingClientRect(data => { //目标位置的节点：类或者id
	uni.createSelectorQuery().select(".arc-content").boundingClientRect(res => { //最外层盒子的节点：类或者id
		uni.pageScrollTo({
			duration: 100, //过渡时间
			scrollTop: data.top - res.top, //到达距离顶部的top值
		})
	}).exec()
}).exec();

例: (上のスクロールバーは uview プラグインです)

<template>
	<view>
		<view class="arc-content">
<!-- 插件 -->
			<u-tabs :list="list" :is-scroll="true" bar-width="120" active-color="#ff5959" :current="current" @change="change"></u-tabs>

			<view class="" style="height: 100upx;"></view>
<!-- 内容 -->
			<view class="comment-content" style="margin-top:16upx;background: #fff;" v-for="(item,index) in list" :key="index" @click="tapwhole">
				<view class="titles" :class="item.eg">{
   
   {item.name}}</view>
				<view class="conts">
					<view class="contitem" v-for="(its,indexs) in list">
						<image src="../../static/[email protected]"></image>
						<text>{
   
   {its.name}}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			list: [
				{
					name: '拓展管理',
					eg:'a'
				},
				{
					name: '仓库管理',
					eg:'b'
				},
				{
					name: '财务管理',
					eg:'c'
				},
				{
					name: '精准营销',
					eg:'d'
				},
				{
					name: '报表查询',
					eg:'e'
				},
				{
					name: '车型查询',
					eg:'f'
				},
				{
					name: '覆盖分布',
					eg:'g'
				},
				{
					name: '仓库智能模块',
					eg:'h'
				},
				{
					name: '服务反馈',
					eg:'i'
				}
			],
			current: 0,
		};
	},
	methods: {
		change(index) {
			console.log(this.list[index].name)
			this.current = index;
				//从评论区域回到顶部
				uni.createSelectorQuery().select("."+this.list[index].eg).boundingClientRect(data=>{//目标位置的节点：类或者id
							uni.createSelectorQuery().select(".arc-content").boundingClientRect(res=>{//最外层盒子的节点：类或者id
										uni.pageScrollTo({
													duration: 100,//过渡时间
													scrollTop:data.top - res.top-80  ,//到达距离顶部的top值
										})
							}).exec()
				}).exec();
		},
		tapwhole:function(){
			uni.navigateTo({
				url:'whole/whole'
			})
		}
	}
};
</script>

<style lang="scss">
	page{
		background: #F3F3F3;
	}
	.u-tabs{
		position: fixed;
		top: 0;
		left: 0;
		z-index: 999;
	}
	.titles {
		font-size: 36upx;
		height: 80upx;
		width: 100%;
		line-height: 80upx;
		padding-left: 24upx;
		font-weight: 500;
	}
	
	.conts {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		padding-bottom: 32upx;
	}
	
	.contitem {
		width: 25%;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 32upx;
	}
	
	.contitem image,
	.offeritem image {
		width: 48upx;
		height: 48upx;
	}
	
	.myoffer {
		margin-top: 16upx;
		background: #fff;
	}
	
	.offer {
		width: 100%;
		height: 160upx;
		display: flex;
		justify-content: space-around;
	}
	
	.offeritem {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 32upx;
	}
</style>