Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

子应用不能正常使用或者监听 window 的滚动,但是可以使用 window.open 打开新链接 #2918

Open
CJohnSnow opened this issue Mar 1, 2024 · 8 comments

Comments

@CJohnSnow
Copy link

CJohnSnow commented Mar 1, 2024

主应用和子应用为两个分开的项目
下面是子应用相关代码:
image

@gongshun
Copy link
Collaborator

gongshun commented Mar 6, 2024

需要用addEventListener添加事件,不能用on添加

@CJohnSnow
Copy link
Author

需要用addEventListener添加事件,不能用on添加

scrollTo 这个不能监听吧

@L0st1
Copy link

L0st1 commented Mar 11, 2024

需要用addEventListener添加事件,不能用on添加

scrollTo 这个不能监听吧

官网的常见问题

这样写是可以的
document.querySelector(seletor)!.scrollIntoView({ behavior: "smooth", block: "start", inline: "nearest" });
子应用监听滚动事件不能绑window

@CJohnSnow
Copy link
Author

需要用addEventListener添加事件,不能用on添加

scrollTo 这个不能监听吧

官网的常见问题

这样写是可以的 document.querySelector(seletor)!.scrollIntoView({ behavior: "smooth", block: "start", inline: "nearest" }); 子应用监听滚动事件不能绑window

我试过这种方法,获取一个 dom 来让它滚动,但是这种还是解决不了 window 不能滚动的问题,主要还是因为子应用不能使用父应用的 window 吧,父应用和子应用滚动会相互影响

@CJohnSnow
Copy link
Author

而且这个 dom 还得设置他自身的 overflow-y 滚动才行,这个时候父应用的 window 滚动和他自己的 overflow-y 滚动就会相互影响

@L0st1
Copy link

L0st1 commented Mar 11, 2024

而且这个 dom 还得设置他自身的 overflow-y 滚动才行,这个时候父应用的 window 滚动和他自己的 overflow-y 滚动就会相互影响

我刚刚试了下window.scrollTo可以在子应用使用……如果你想避免子应用也会有滚动条(其实这也不算大问题)

@CJohnSnow
Copy link
Author

而且这个 dom 还得设置他自身的 overflow-y 滚动才行,这个时候父应用的 window 滚动和他自己的 overflow-y 滚动就会相互影响

我刚刚试了下window.scrollTo可以在子应用使用……如果你想避免子应用也会有滚动条(其实这也不算大问题)

你只启动了子应用吧,我这边是主和子一起启动,然后在主使用的

@L0st1
Copy link

L0st1 commented Mar 11, 2024

而且这个 dom 还得设置他自身的 overflow-y 滚动才行,这个时候父应用的 window 滚动和他自己的 overflow-y 滚动就会相互影响

我刚刚试了下window.scrollTo可以在子应用使用……如果你想避免子应用也会有滚动条(其实这也不算大问题)

你只启动了子应用吧,我这边是主和子一起启动,然后在主使用的

是主子应用一起运行的,效果点app-vue-history可以看到,新增代码的位置在commit可以找到
https://github.com/L0st1/qiankun-vue-demo/tree/recurrent-scrollTo

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants