<template>
  <div ref="wrapper" class="ui-scroll-view h-full flex-1 overflow-scroll">
    <div ref="content" class="overflow-hidden">
      <slot> </slot>
    </div>
  </div>
</template>

<script>
import BScroll from "better-scroll";

export default {
  data() {
    return {
      bs: null,
      observer: null,
      childHeight: 0
    };
  },

  mounted() {


    // this.bs = new BScroll(this.$refs.wrapper, {

    //   scrollY: true,
    //   bounce: false,
    //   click: true,
    // });
    

    const observer = new MutationObserver(() => {
      this.bs?.refresh();
    })
    
    observer.observe(this.$refs.content, {
      childList: true, // 子节点的变动（新增、删除或者更改）
      attributes: true, // 属性的变动
      characterData: true, // 节点内容或节点文本的变动
      subtree: true // 是否将观察器应用于该节点的所有后代节点
    })
    // setInterval(() => {
    //   this.bs?.refresh();
    // }, 250);

  },
  // unmounted() {
  //   this.observer?.disconnect()
  // },
  updated() {
    this.$nextTick(() => {

      this.bs?.refresh();
    })
  },
};
</script>

<style lang="scss" scoped>

</style>
