如何解决类星体滚动工具根本不起作用一切都在文档中进行了设置,但仍然像砖头一样还是应该只使用普通的JS?
<template>
<q-page>
<q-scroll-observer @scroll="onScroll"/>
//Button on click scroll to the last block
<q-btn @click="scrollToElement($refs.contact.$el)" style="z-index: 1000">Btn</q-btn>
//Empty blocks with height and width,just to test scroll
<the-greeting refs="greet"
class="scroll bg-dark"
style="height: calc(100vh - 100px);
position: relative;"></the-greeting>
<my-interests ref="interests"
class="scroll interests bg-red"
style="height: 700px"></my-interests>
<my-projects ref="projects"
class="scroll bg-blue-3"
style="height: 500px"></my-projects>
<contact-me ref="contact"
class="scroll bg-blue-6"
style="height: 1000px"></contact-me>
</q-page>
</template>
<script>
import TheGreeting from 'components/TheGreeting/TheGreeting.vue'
import MyInterests from 'components/MyInterests/MyInterests.vue'
import ContactMe from 'components/ContactMe/ContactMe.vue'
import MyProjects from 'components/MyProjects/MyProjects.vue'
import { scroll } from 'quasar'
const { getScrollPosition,setScrollPosition,getScrollTarget } = scroll
export default {
name: 'PageIndex',components: {
TheGreeting,MyInterests,ContactMe,MyProjects
},data(){
return {
}
},methods: {
scrollToElement (el) {
const ele = el;
const target = getScrollTarget(ele);
const offset = ele.offsetTop - ele.scrollHeight; // i tried const offset = ele.offsetTop,with or without it
const duration = 1000
setScrollPosition(target,offset,duration);
}
}
}
</script>
该操作不起作用,我做了documentation所示的所有操作,此外,我找到了论坛并从那里尝试了代码,但仍然没有forum。我想念什么吗?我只想通过按按钮重定向到最后一个块。 这件事行不通,我做了documentation所示的所有操作,此外,我找到了论坛并从那里尝试了代码,但仍然没有forum。我想念什么吗?我只想按一下按钮重定向到最后一个块。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。