小程序采用Scroll-view实现瞄点，不兼容input标签解决方法

小程序采用Scroll-view实现瞄点，不兼容input标签解决方法

1、原来采用的方法

上述为了测试scroll-view与input在安卓端不兼容，实验测试确实是不兼容。
2、采用scroll-view实现瞄点的方法

<scroll-view style="height:100%" scroll-into-view="{
     {toView}}" scroll-y="true" scroll-with-animation="{
     {true}}">
<view id="test1">111111</view>
<view id="test2">111111</view>
<view id="test3">111111</view>
</scroll-view>
that.setData({
     
   toView: jump
});

这里jump为对应项的id值,这里可设置为test1 test2..
必须保证scroll-view高度存在；实现瞄点页面内容必须满足大于整屏

3、这里说一下如何解决页面实现瞄点并且页面需要使用到input标签。

if (jump) {
     
      //1:返回一个残血对象的实例
      const query = wx.createSelectorQuery();
      //【point1】指的是要跳转的id选择器元素
      //2:在当前页面下查询指定id选择器的节点，获取节点信息
      query.select('#' + jump).boundingClientRect();
      //3:可用于获取显示区域的尺寸、滚动位置等信息，然后添加截图的滚动位置查询请求
      query.selectViewport().scrollOffset();
      //4:开始执行
      query.exec((res) => {
     
        //res[0]是步骤2中的数据，res[1]是步骤3中的数据
        if (res[0] && res[1]) {
     
          //5:将页面滚动到目标位置
          wx.pageScrollTo({
     
            //6:计算滚动到目标的位置
            scrollTop: res[0].top + res[1].scrollTop,
            duration: 300,
          })
        }
      });
    }

采用这种方法解决，不是用scroll-view实现瞄点，jump为动态的id值。测试Android与iphone均可实现。