mirror of
https://github.com/sim1222/misskey.git
synced 2025-08-03 23:16:28 +09:00
perf(client): use shallowRef for html element ref
This commit is contained in:
@ -35,7 +35,7 @@ const emit = defineEmits<{
|
||||
(ev: 'update:modelValue', v: boolean): void;
|
||||
}>();
|
||||
|
||||
let button = $ref<HTMLElement>();
|
||||
let button = $shallowRef<HTMLElement>();
|
||||
const checked = toRefs(props).modelValue;
|
||||
const toggle = () => {
|
||||
if (props.disabled) return;
|
||||
|
@ -40,7 +40,7 @@ const props = withDefaults(defineProps<{
|
||||
|
||||
let opened = $ref(props.defaultOpen);
|
||||
let openedAtLeastOnce = $ref(props.defaultOpen);
|
||||
let root = $ref<HTMLElement>();
|
||||
let root = $shallowRef<HTMLElement>();
|
||||
|
||||
function enter(el) {
|
||||
const elementHeight = el.getBoundingClientRect().height;
|
||||
|
@ -34,7 +34,7 @@
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { onMounted, onUnmounted, nextTick, ref, watch, computed, toRefs } from 'vue';
|
||||
import { onMounted, onUnmounted, nextTick, ref, shallowRef, watch, computed, toRefs } from 'vue';
|
||||
import { debounce } from 'throttle-debounce';
|
||||
import MkButton from '@/components/MkButton.vue';
|
||||
import { useInterval } from '@/scripts/use-interval';
|
||||
@ -74,9 +74,9 @@ const focused = ref(false);
|
||||
const changed = ref(false);
|
||||
const invalid = ref(false);
|
||||
const filled = computed(() => v.value !== '' && v.value != null);
|
||||
const inputEl = ref<HTMLElement>();
|
||||
const prefixEl = ref<HTMLElement>();
|
||||
const suffixEl = ref<HTMLElement>();
|
||||
const inputEl = shallowRef<HTMLElement>();
|
||||
const prefixEl = shallowRef<HTMLElement>();
|
||||
const suffixEl = shallowRef<HTMLElement>();
|
||||
const height =
|
||||
props.small ? 35 :
|
||||
props.large ? 39 :
|
||||
|
@ -34,7 +34,7 @@ const emit = defineEmits<{
|
||||
(ev: 'update:modelValue', v: boolean): void;
|
||||
}>();
|
||||
|
||||
let button = $ref<HTMLElement>();
|
||||
let button = $shallowRef<HTMLElement>();
|
||||
const checked = toRefs(props).modelValue;
|
||||
const toggle = () => {
|
||||
if (props.disabled) return;
|
||||
|
Reference in New Issue
Block a user