refactor(frontend): 非推奨となったReactivity Transformを使わないように (#12539)
* refactor(frontend): 非推奨となったReactivity Transformを使わないように * refactor: 不要な括弧を除去 * fix: 不要なアノテーションを除去 * fix: Refの配列をrefしている部分の対応 * refactor: 不要な括弧を除去 * fix: lint * refactor: Ref、ShallowRef、ComputedRefの変数の宣言をletからconstに置換 * fix: type error * chore: drop reactivity transform from eslint configuration * refactor: remove unnecessary import * fix: 対応漏れ
This commit is contained in:
parent
e42c91dee7
commit
406b4bdbe7
277 changed files with 3353 additions and 3441 deletions
|
@ -41,7 +41,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, onUnmounted, ref, inject } from 'vue';
|
||||
import { onMounted, onUnmounted, ref, inject, shallowRef, computed } from 'vue';
|
||||
import tinycolor from 'tinycolor2';
|
||||
import XTabs, { Tab } from './MkPageHeader.tabs.vue';
|
||||
import { scrollToTop } from '@/scripts/scroll.js';
|
||||
|
@ -69,13 +69,13 @@ const metadata = injectPageMetadata();
|
|||
const hideTitle = inject('shouldOmitHeaderTitle', false);
|
||||
const thin_ = props.thin || inject('shouldHeaderThin', false);
|
||||
|
||||
let el = $shallowRef<HTMLElement | undefined>(undefined);
|
||||
const el = shallowRef<HTMLElement | undefined>(undefined);
|
||||
const bg = ref<string | undefined>(undefined);
|
||||
let narrow = $ref(false);
|
||||
const hasTabs = $computed(() => props.tabs.length > 0);
|
||||
const hasActions = $computed(() => props.actions && props.actions.length > 0);
|
||||
const show = $computed(() => {
|
||||
return !hideTitle || hasTabs || hasActions;
|
||||
const narrow = ref(false);
|
||||
const hasTabs = computed(() => props.tabs.length > 0);
|
||||
const hasActions = computed(() => props.actions && props.actions.length > 0);
|
||||
const show = computed(() => {
|
||||
return !hideTitle || hasTabs.value || hasActions.value;
|
||||
});
|
||||
|
||||
const preventDrag = (ev: TouchEvent) => {
|
||||
|
@ -83,8 +83,8 @@ const preventDrag = (ev: TouchEvent) => {
|
|||
};
|
||||
|
||||
const top = () => {
|
||||
if (el) {
|
||||
scrollToTop(el as HTMLElement, { behavior: 'smooth' });
|
||||
if (el.value) {
|
||||
scrollToTop(el.value as HTMLElement, { behavior: 'smooth' });
|
||||
}
|
||||
};
|
||||
|
||||
|
@ -111,14 +111,14 @@ onMounted(() => {
|
|||
calcBg();
|
||||
globalEvents.on('themeChanged', calcBg);
|
||||
|
||||
if (el && el.parentElement) {
|
||||
narrow = el.parentElement.offsetWidth < 500;
|
||||
if (el.value && el.value.parentElement) {
|
||||
narrow.value = el.value.parentElement.offsetWidth < 500;
|
||||
ro = new ResizeObserver((entries, observer) => {
|
||||
if (el && el.parentElement && document.body.contains(el as HTMLElement)) {
|
||||
narrow = el.parentElement.offsetWidth < 500;
|
||||
if (el.value && el.value.parentElement && document.body.contains(el.value as HTMLElement)) {
|
||||
narrow.value = el.value.parentElement.offsetWidth < 500;
|
||||
}
|
||||
});
|
||||
ro.observe(el.parentElement as HTMLElement);
|
||||
ro.observe(el.value.parentElement as HTMLElement);
|
||||
}
|
||||
});
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue