usbharu
/
misskey
mirror of https://github.com/misskey-dev/misskey.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

refactor(frontend): use useTemplateRef

This commit is contained in:
syuilo 2025-10-06 10:18:14 +09:00
parent 99686801a0
commit ba9924abdb
2 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
packages/frontend/src/components/MkSelect.vue
View File

@ -68,7 +68,7 @@ export type GetMkSelectValueTypesFromDef<T extends MkSelectItem[]> = T[number] e
</script> </script>
<script lang="ts" setup generic="const ITEMS extends MkSelectItem[], MODELT extends OptionValue"> <script lang="ts" setup generic="const ITEMS extends MkSelectItem[], MODELT extends OptionValue">
import { onMounted, nextTick, ref, watch, computed, toRefs } from 'vue'; import { onMounted, nextTick, ref, watch, computed, toRefs, useTemplateRef } from 'vue';
import { useInterval } from '@@/js/use-interval.js'; import { useInterval } from '@@/js/use-interval.js';
import type { MenuItem } from '@/types/menu.js'; import type { MenuItem } from '@/types/menu.js';
import * as os from '@/os.js'; import * as os from '@/os.js';
@ -87,8 +87,8 @@ const props = defineProps<{
type ModelTChecked = MODELT & ( type ModelTChecked = MODELT & (
MODELT extends GetMkSelectValueTypesFromDef<ITEMS> MODELT extends GetMkSelectValueTypesFromDef<ITEMS>
? unknown ? unknown
: 'Error: The type of model does not match the type of items.' : 'Error: The type of model does not match the type of items.'
); );
const model = defineModel<ModelTChecked>({ required: true }); const model = defineModel<ModelTChecked>({ required: true });
@ -97,10 +97,10 @@ const { autofocus } = toRefs(props);
const focused = ref(false); const focused = ref(false);
const opening = ref(false); const opening = ref(false);
const currentValueText = ref<string | null>(null); const currentValueText = ref<string | null>(null);
const inputEl = ref<HTMLObjectElement | null>(null); const inputEl = useTemplateRef('inputEl');
const prefixEl = ref<HTMLElement | null>(null); const prefixEl = useTemplateRef('prefixEl');
const suffixEl = ref<HTMLElement | null>(null); const suffixEl = useTemplateRef('suffixEl');
const container = ref<HTMLElement | null>(null); const container = useTemplateRef('container');
const height = const height =
props.small ? 33 : props.small ? 33 :
props.large ? 39 : props.large ? 39 :

8
packages/frontend/src/pages/user/home.vue
View File

@ -159,7 +159,7 @@ SPDX-License-Identifier: AGPL-3.0-only
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { defineAsyncComponent, computed, onMounted, onUnmounted, onActivated, onDeactivated, nextTick, watch, ref } from 'vue'; import { defineAsyncComponent, computed, onMounted, onUnmounted, onActivated, onDeactivated, nextTick, watch, ref, useTemplateRef } from 'vue';
import * as Misskey from 'misskey-js'; import * as Misskey from 'misskey-js';
import { getScrollContainer } from '@@/js/scroll.js'; import { getScrollContainer } from '@@/js/scroll.js';
import MkNote from '@/components/MkNote.vue'; import MkNote from '@/components/MkNote.vue';
@ -222,9 +222,9 @@ const router = useRouter();
const user = ref(props.user); const user = ref(props.user);
const narrow = ref<null | boolean>(null); const narrow = ref<null | boolean>(null);
const rootEl = ref<null | HTMLElement>(null); const rootEl = useTemplateRef('rootEl');
const bannerEl = ref<null | HTMLElement>(null); const bannerEl = useTemplateRef('bannerEl');
const memoTextareaEl = ref<null | HTMLElement>(null); const memoTextareaEl = useTemplateRef('memoTextareaEl');
const memoDraft = ref(props.user.memo); const memoDraft = ref(props.user.memo);
const isEditingMemo = ref(false); const isEditingMemo = ref(false);
const moderationNote = ref(props.user.moderationNote ?? ''); const moderationNote = ref(props.user.moderationNote ?? '');