需求：在 uniapp 写 App 时，根据后端接口返回的数据渲染图文，并且要对图片进行锚点定位。

前提：后端要给每张图片一个单独的参数，用来区分每张图片。

思路：前端将这个特定参数注入到图片标签中，并且根据此特定参数进行锚点定位。

疑问：怎么用 uniapp 在 App 中进行锚点定位呢？

方法：用 uniapp 的 scroll-view 的 scroll-into-view 属性进行锚点定位。

scroll-view 标签必须给高度，不然在 App 中无法滚动，进而实现不了锚点定位效果。
（我的页面是后端返回的数据，高度不固定，因此不能写死高度。因此我将 <scroll-view> </scroll-view> 包裹住整个页面，再给一个页面高度 100vh ，就解决了高度问题。）

代码：

<template><view><!-- #ifndef H5 --><scroll-view class="scroller" :scroll-into-view="toView" scroll-y="true" scroll-with-animation="true"><!-- #endif --><view class="parseContainer" v-for="item in contentList" :key="item.id"><view v-for="item1 in item.contents" :key="item1.id"><!-- 需要锚点定位的图片： --><image v-for="(item2, index2) in item1.coverImgs.split(',')" :key="index2" style="width: 100%" mode="widthFix" :src="item2" :id="'anchor'+item1.imgList[0].id"></image><text class="word">{{ item1.content }}</text></view></view><!-- #ifndef H5 --></scroll-view><!-- #endif --></view>
</template>export default {data() {return {toView:'',}},methods: {toAnchor(id) {let anchorId = 'anchor'+id//  #ifdef H5document.documentElement.scrollTop = document.getElementById(anchorId).offsetTop - 100// #endif// #ifndef H5this.toView = anchorId;// #endif}}
}

以上代码中 #ifdef H5 、#ifndef H5 、 #endif 均为 条件编译 ，因为在 H5 中锚点定位简单得很，不用这么复杂，所以单独用别的方法来处理。

---

番外：
也尝试过用以下 uni.pageScrollTo() 来做锚点定位，但是我这边 会出现 Bug： 同一个元素多次触发锚点次定位时，无法定位到准确位置…

let anchorId = 'anchor'+id
//  #ifdef H5
document.documentElement.scrollTop = document.getElementById(anchorId).offsetTop - 100
// #endif
// #ifndef H5
uni.createSelectorQuery().select(`.${anchorId}`).boundingClientRect(data => {// 此处的定时器，目的是：等待页面渲染完，然后滚动页面this.$nextTick(() => {uni.pageScrollTo({scrollTop: data.top,})})
}).exec();
// #endif