记录 vant-ui van-pull-refresh 的一些坑

坑

• van-pull-refresh 里面要包含一个<div ref="fresh’> 在mounted里面设置一下高度 屏幕可视高度 - box距离顶部top，因为van-pull-refresh有个overflow:true属性，高度不够的时候下拉的时候会隐藏一些内容。

mounted  () {
    this.freshHeight = document.documentElement.clientHeight - this.$refs.fresh.getBoundingClientRect().top
  }

• 设置div ref="fresh的 overflow-y:scroll 属性让其内部列表可以滚动。设置了div ref="fresh的 padding-bottom后这样不会被底部tabbar遮盖，最重要的是设置box-sizing’: 'border-box’
• 如果列表没有就展示没有数据的图片，我写成了组件，要写在div ref="fresh 里面，如果写在外面，会因z-index层叠样式原因会覆盖下拉组件导致不起作用。

贴上全部代码

<template>
  <div class="wrapper">
    <div class="search" @click="$router.push({ path: '/search' })">
      <van-search disabled placeholder="请输入搜索关键词" />
    </div>
      <va