uni-app vue2和vue3滚动监听如何使用？

uni-app 有2种监听滚动的方法： 一、在vue2中 1、可以用 onPageScroll 方法

onPageScroll(res) {
    console.log(res)
}

2、如果是在自组件中，我们只需要自组件区域滚动，不需要整个页面滚动，那么我们可以使用 scroll-view 组件

<scroll-view scroll-y class="page" @scroll="scroll">

<script>
    scroll(event) {
        //获取到顶部距离
        this.scrollTop = event.detail.scrollTop 
    }
</script>

二、uni-app在vue3 + ts 中如何使用 onPageScroll

const scroll = (event) => {
    var opcityColor = parseInt((event.detail.scrollTop/150).toFixed(2)*100)
    if(opcityColor>100){
	state.fullColor = "rgba(255,85,127,"+"1)"
	state.fColor = "rgba(255,255,255,1)"
	
    }else{
	state.fullColor = "rgba(255,85,127,"+opcityColor/100+")"
	state.fColor = "rgba(255,255,255,"+opcityColor/100+")"
		
    }
}

此时查看页面我们发现该事件并未触发，在 uni-app vue3中，采用了按需引入，因此需要我们在使用之前先引入。如下：

import { onPageScroll} from '@dcloudio/uni-app'

这样我们就完成了uni-app在vue3中的使用