<script setup>
import { ref, onMounted} from 'vue'
import ImgWall from './ImgWall.vue';
const slideShow = ref(null)
defineProps({
  msg: String,
const lock = ref(false) // 锁
const ImgWallRef = ref(null)
onMounted(() => {
  console.log("渲染完成")
  slideShow.value.addEventListener('mousewheel',mousewheelHandler)
function mousewheelHandler(event) {
  if (lock.value) {
    return
  if (event.wheelDelta < 0){
    lock.value = true
    scrollHandler()
function scrollHandler() {
  console.log("滚动")
  console.log(document.querySelector('.img-wall'))
  document.querySelector('.img-wall').scrollIntoView({ behavior: 'smooth'})
</script>
<template>
  <div class="container" ref="slideShow">
	代码省略CSDN：https://blog.csdn.net/weixin_45721179
  </div>
  <div class=".img-wall"></div>
  <ImgWall ref="ImgWallRef"/>
</template>
css省略
在滚动后无法移动到元素位置，并且不报错，但是在控制台输入
 
document.querySelector('.img-wall').scrollIntoView({ behavior: 'smooth'})
可正确滚动，并且将这句放入onMounted也可正确实现移动效果，通过点击事件去执行也可正常触发效果，但有概率中途卡停
 起初意外是dom元素获取出现了问题，后多次测试发现是smooth的问题，改成auto即可实现滚动，但无过渡效果
 综合考虑还是使用类似轮播图切换的方式来切换下一页比较稳妥
				
微信小程序scroll-view的scroll-into-view无效如何解决
最近在写小程序项目遇到这么一个问题：在使用scroll-into-view的时候无效。
在网上查了一遍，给出的答案有：
1.给scroll-view要设置高度，必须设置上scroll-y或者scroll-x为true（必须要的）
2.scroll-into-view初始化设置的时候，可能因为页面或者数据未加载不能跳转。...
				
背景：左菜单栏，右内容栏，点击左菜单栏，右边自动滚动到指定位置，其中右边固定高度，超出显示scroll。
解决：调用scrollIntoView后，再修改下scrollTop
  document.documentElement.scrollTop = document.documentElement.scrollTop - 1;
				
el.scrollIntoView()
会将元素滚到窗口可见范围内，包括水平跟垂直
当加上参数 behavior: "smooth" 时，在特殊情况下（现在还没搞懂是什么原因），scrollIntoView 会刚刚好地，将元素右边紧贴着窗口右边界，不多也不少（正常情况下是会多出那么一点的）。
导致后续的滚动执行了但不生效。
解决办法是加上参数 inline: "start"（inline 默认是 “nearest”）。这样可以避免滚动后元素右边紧贴窗口右边界。不会出现滚不动的问题
				
之前在一次开发中，用到scrollIntoView方法，但遇到神奇的事情，居然无法生效。。。。
在一顿猛烈的排查下才发现该方法需要页面完全加载后才能生效，以下是避免踩雷的方法
	运用vue中的this.$nextTick方法
	this.$nextTick(()=>{
		document.getElementById(target).scrollIntoView();
	利用setTimeout方法
	setTimeout(function(){
   dom.scrollIntoView({
            behavior: "smooth",
            block: "nearest", //"start",// | "center" | "end" | "nearest", // 默认
            inline: "nearest" 
我的框架是react hook 开发
    useEffect(() => {
        const anchorElement = document.getElementById('current-module'); // 第一步获取到滚动元素
        if (selectModuleIndex === 0 && anchorElement) {
            anchorElement.scrollTop
				
官方文档写的简单：
Element 接口的scrollIntoView()方法会滚动元素的父容器，使被调用scrollIntoView()的元素对用户可见。
element.scrollIntoView(); // 等同于element.scrollIntoView(true)
element.scrollIntoView(alignToTop);// Boolean型参数
element.scrollIntoView(scrollIntoViewOptions);// Object型参数
今天需要做一个点击icon滑动到文章评论区的功能，采用了scrollIntoView，发现在移动端偶现失效了。
代码如下：
 commentRef.current.scrollIntoView({
     behavior: 'smooth',
思考1 是否由于浏览器bug导致
据这篇博文描述是由于滑动过程中进行了原生事件的监听就会阻断事件继续执行。
因此替换成 scollTo，发现滑动有改善，但是还是有定位不准的问题。
根据这个回答得出可以采用 requestAnimatio
				
横向视图scroll-into-view指定的id为hpink，但是效果图中显示的还是第1个view(未达到效果);
纵向视图scroll-into-view指定的id为yellowgreen，效果图中显示的则是yellowgreen(达到了效果);
转载于:https://www.cnblogs.com/loveamyforever/p/6287571.html...
				uniapp qq小程序启动报错 VM20:252 The “path“ argument must be of type string. Received type boolean
                    CSDN-Ada助手: 
                    恭喜您第三篇博客的发表！阅读了您的博客，我发现您遇到了scrollIntoView滚动不生效的问题，这是一个常见的问题，需要仔细排查才能解决。感谢您分享自己的经验，相信能够帮助到更多人。
在您下一步的创作中，建议您可以结合实际项目或者工作中遇到的问题，分享自己的思考和解决方法，这样更能够引起读者的共鸣和关注。期待您更多高质量的分享！
CSDN 正在通过评论红包奖励优秀博客，请看红包流：https://bbs.csdn.net/?type=4&header=0&utm_source=csdn_ai_ada_blog_reply3，我们会奖励持续创作和学习的博主，请看：https://bbs.csdn.net/forums/csdnnews?typeId=116148&utm_source=csdn_ai_ada_blog_reply3
                uniapp qq小程序启动报错 VM20:252 The “path“ argument must be of type string. Received type boolean
                    code happy: