vue3+ts+better-scroll封装的scroll组件，定义接收的变量值类型应该是什么类型?

  • Z时代
  • 2024-02-26
  • 分类：IT

vue3+ts+better-scroll封装的scroll组件，定义接收的变量值类型应该是什么类型?

<template>
  <div ref="wrapperRef">
    <slot></slot>
  </div>
</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue'
import BScroll from '@better-scroll/core'
import ObserveDOM from '@better-scroll/observe-dom'
import MouseWheel from '@better-scroll/mouse-wheel'
import Pullup from '@better-scroll/pull-up'
BScroll.use(ObserveDOM)
BScroll.use(MouseWheel)
BScroll.use(Pullup)
const props = defineProps({
  probeType: { type: Number, default: 1 },
  click: { type: Boolean, default: true },
  eventPassthrough: { type: String, default: '' }
})
const emits = defineEmits(['scroll'])
const wrapperRef = ref<HTMLElement | string>('')
const scroll = ref<BScroll>()
// const scroll = ref<BScrollConstructor<{}> & PluginAPI>()
onMounted(() => {
  scroll.value = new BScroll(wrapperRef.value, {
    observeDOM: true,
    mouseWheel: {
      speed: 20,
      invert: false,
      easeTime: 300
    },
    pullUpLoad: true,
    ...props
  })
  // scroll.value
  if (props.probeType > 0) {
    scroll.value.on('scroll', (pos: { x: number; y: number }) => {
      emits('scroll', pos)
    })
  }
})
defineExpose({ scroll })
</script>
<style scoped></style>

一开始我定义scroll的类型为BScroll类型，但是在使用pull-up插件时，不能智能提示实例上的方法，比如finishPullUp...，我直接在onMounted函数中定义变量接收可以看到类型是BScrollConstructor<{}> & PluginAPI，但是在onMounted中的变量我没法暴露出去，那么还是得在外部定义变量接收，如果变量直接定义BScrollConstructor<{}> & PluginAPI这个类型又报类型错误，那么正确的类型应该是什么呢？

回答：

你打印下你要定义的变量一般就能看见了

以上是 vue3+ts+better-scroll封装的scroll组件，定义接收的变量值类型应该是什么类型? 的全部内容， 来源链接： utcz.com/p/937356.html

回到顶部