feat: add use-lazy-render

This commit is contained in:
chenjiahan 2020-08-25 08:26:18 +08:00
parent bd41102cf3
commit d9e9879465
2 changed files with 16 additions and 3 deletions

View File

@ -0,0 +1,13 @@
import { ref, Ref, watch } from 'vue';
export function useLazyRender(show: Ref<boolean>) {
const inited = ref(show.value);
watch(show, (value) => {
if (value) {
inited.value = value;
}
});
return inited;
}

View File

@ -6,6 +6,7 @@ import { raf, doubleRaf } from '../utils/dom/raf';
// Composition
import { useParent } from '../api/use-relation';
import { useLazyRender } from '../api/use-lazy-render';
// Components
import Cell from '../cell';
@ -42,7 +43,7 @@ export default createComponent({
});
const show = ref(expanded.value);
const inited = ref(expanded.value);
const shouldRender = useLazyRender(show);
const onTransitionEnd = () => {
if (!expanded.value) {
@ -59,7 +60,6 @@ export default createComponent({
if (value) {
show.value = true;
inited.value = true;
}
// Use raf: flick when opened in safari
@ -118,7 +118,7 @@ export default createComponent({
};
const renderContent = () => {
if (inited.value) {
if (shouldRender.value) {
return (
<div
ref={wrapper}