-
Notifications
You must be signed in to change notification settings - Fork 1.7k
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
feat(image):支持懒加载 #3096
The head ref may contain hidden characters: "feat(image)-\u652F\u6301\u61D2\u52A0\u8F7D"
feat(image):支持懒加载 #3096
Conversation
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Codecov Report
@@ Coverage Diff @@
## main #3096 +/- ##
==========================================
- Coverage 63.21% 63.10% -0.11%
==========================================
Files 1012 1010 -2
Lines 20987 20988 +1
Branches 5460 5465 +5
==========================================
- Hits 13267 13245 -22
- Misses 6303 6331 +28
+ Partials 1417 1412 -5
Continue to review full report at Codecov.
|
}) | ||
|
||
onBeforeUnmount(() => { | ||
if (props.lazy) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
如果一开始 lazy 最后不 lazy 就泄漏了
src/image/src/utils.ts
Outdated
if (imgObserver === null) { | ||
imgObserverOptions = { | ||
root: document.querySelector(root), | ||
threshold: 0.1 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
可以考虑露一点就搞,不加缓冲
src/image/src/utils.ts
Outdated
|
||
export const imgObserverHandler: ( | ||
el: HTMLImageElement | null, | ||
unobserve: boolean, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
拆两个函数吧,两个名字
src/image/src/Image.tsx
Outdated
@@ -121,6 +143,7 @@ export default defineComponent({ | |||
style={[imgProps.style || '', { objectFit: this.objectFit }]} | |||
data-error={this.showError} | |||
data-preview-src={this.previewSrc || this.src} | |||
data-src={this.showError ? this.fallbackSrc : this.src || imgProps.src} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
这块和上面那块看起来整体有点乱,能不能抽到 setup 算一下
整体逻辑看起来挺合理的 |
cbd0619
to
e757830
Compare
学习学习 |
这种方案行不行