小程序中webview在百度地图和vant搜索框页面顶出

需求是在小程序的webview里写代码

在一个页面使用vue-baidu-map的地图,使用vant的搜索框组件。在点击软键盘的搜索页面的时候地图会被顶出去。错误截图没有。

下面是解决办法:

1.

        <van-search
          @blur.prevent="inputLoseFocus"
        ></van-search>

在serch这个组件里加入以上代码

2.在methods里加入

inputLoseFocus() {
      console.log(`window.pageYOffset: ${window.pageYOffset}`)
      window.scrollTo({
        top: window.pageYOffset,
        behavior: ‘smooth‘
      })
    },

3.在需要刷新页面的地方如:请求搜索的then方法和catch方法里加入调用方法,即可解决

this.inputLoseFocus()

小程序中webview在百度地图和vant搜索框页面顶出

上一篇:小程序 学习四 页面的注册及周期函数


下一篇:微信小程序——自定义菜单tabbar