oscar-surf/misskey
oscar-surf/misskey
0
0
Fork 0
Code Issues Activity

fix(frontend): disconnect ResizeObserver

Browse source
This commit is contained in:
tamaina 2023-05-31 16:00:55 +00:00
parent 6addf9002c
commit 1cc616b86c
3 changed files with 40 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

20
packages/frontend/src/components/MkContainer.vue
View file

@ -34,7 +34,7 @@
</template>
<script lang="ts" setup>
import { onMounted, ref, shallowRef, watch } from 'vue';
import { onMounted, onUnmounted, ref, shallowRef, watch } from 'vue';
import { defaultStore } from '@/store';
import { i18n } from '@/i18n';
@ -83,13 +83,19 @@ function afterLeave(el) {
const calcOmit = () => {
if (omitted.value || ignoreOmit.value || props.maxHeight == null) return;
if (!contentEl.value) return;
const height = contentEl.value.offsetHeight;
omitted.value = height > props.maxHeight;
};
const omitObserver = new ResizeObserver((entries, observer) => {
calcOmit();
});
onMounted(() => {
watch(showBody, v => {
const headerHeight = props.showHeader ? headerEl.value.offsetHeight : 0;
if (!rootEl.value) return;
const headerHeight = props.showHeader ? headerEl.value?.offsetHeight ?? 0 : 0;
rootEl.value.style.minHeight = `${headerHeight}px`;
if (v) {
rootEl.value.style.flexBasis = 'auto';
@ -100,13 +106,15 @@ onMounted(() => {
immediate: true,
});
rootEl.value.style.setProperty('--maxHeight', props.maxHeight + 'px');
if (rootEl.value) rootEl.value.style.setProperty('--maxHeight', props.maxHeight + 'px');
calcOmit();
new ResizeObserver((entries, observer) => {
calcOmit();
}).observe(contentEl.value);
if (contentEl.value) omitObserver.observe(contentEl.value);
});
onUnmounted(() => {
omitObserver.disconnect();
});
</script>