<template>
  <div class="vux-scroller-header-box">
    <div style="height:46px;">
      <x-header class="vux-scroller-header">
        I'm header
      </x-header>
    </div>
    <scroller
      ref="scroller"
      lock-x
      scrollbar-y
      :height="-46-46+'px'"
    >
      <div
        class="box2"
        style="padding-bottom:50px"
      >
        <p
          v-for="i in 80"
          :key="i"
        >
          placeholder {{ i }}
        </p>
      </div>
    </scroller>
  </div>
</template>

<script>
import { Scroller, XHeader } from '../components/_index'

export default {
  components: {
    Scroller,
    XHeader
  },
  ready () {
    this.$nextTick(() => {
      if (this.$refs.scroller) {
        this.$refs.scroller.reset()
      }
    })
  }
}
</script>
