小程序锚点实现(就是html那个#)

最新推荐文章于 2025-03-12 14:36:48 发布

雪狼之夜

最新推荐文章于 2025-03-12 14:36:48 发布

阅读量1.3k

点赞数 13

分类专栏： js 微信小程序文章标签： apache

本文链接：https://blog.csdn.net/xuelang532777032/article/details/145393324

版权

js 同时被 2 个专栏收录

59 篇文章

订阅专栏

微信小程序

25 篇文章

订阅专栏

uniapp官方文档：

地址https://uniapp.dcloud.net.cn/component/scroll-view.html#scroll-view

原生小程序官方文档：

https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html

你浏览器ctrl+f去搜scroll-into-view

<scroll-view> 标签下的scroll-into-view

先看代码，我说几个注意的点


<template>
	<view>
		小程序锚点scroll-into-view
		<scroll-view  :scroll-into-view='text' style="height: 200px;border:1px #ddd solid; margin: 10px;" scroll-y >
			<view v-for="(v,i) in 100" :id="'a_'+i" >{
  
  {i}}</view>
		</scroll-view>
		请在下面文本框输入要跳转的锚点
		<input class="text" focus v-model="text" />
		更多前端干货：https://mp.weixin.qq.com/mp/appmsgalbum?__biz=MzI1NjAxODkzMg==&action=getalbum&album_id=3102070220246171651#wechat_redirect
	</view>
</template>
<script>
	export default {
		//转发朋友

		data() {
			return {
				text:"a_39",//初始化在a_39这个锚点
				arr:[]
			}
		},
		onShow(){

		},
		onReady() {
			let m=this;
		},
		methods: {
		}
	}
</script>
<style>
	.text{
		border:1px #ddd solid;margin: 10px;
	}
</style>