mirror of
https://github.com/misskey-dev/misskey.git
synced 2026-05-13 15:15:45 +02:00
enhance(frontend): MkInputでthrottleできるように & delay設定できるように
This commit is contained in:
@@ -53,7 +53,7 @@ type ModelValueType<T extends SupportedTypes> =
|
||||
|
||||
<script lang="ts" setup generic="T extends SupportedTypes = 'text'">
|
||||
import { onMounted, onUnmounted, nextTick, ref, useTemplateRef, watch, computed, toRefs } from 'vue';
|
||||
import { debounce } from 'throttle-debounce';
|
||||
import { throttle, debounce } from 'throttle-debounce';
|
||||
import { useInterval } from '@@/js/use-interval.js';
|
||||
import type { InputHTMLAttributes } from 'vue';
|
||||
import type { SuggestionType } from '@/utility/autocomplete.js';
|
||||
@@ -81,7 +81,8 @@ const props = defineProps<{
|
||||
min?: number;
|
||||
max?: number;
|
||||
inline?: boolean;
|
||||
debounce?: boolean;
|
||||
debounce?: boolean | number;
|
||||
throttle?: boolean | number;
|
||||
manualSave?: boolean;
|
||||
small?: boolean;
|
||||
large?: boolean;
|
||||
@@ -135,7 +136,8 @@ const updated = () => {
|
||||
}
|
||||
};
|
||||
|
||||
const debouncedUpdated = debounce(1000, updated);
|
||||
const throttledUpdated = throttle(typeof props.throttle === 'number' ? props.throttle : 1000, updated);
|
||||
const debouncedUpdated = debounce(typeof props.debounce === 'number' ? props.debounce : 1000, updated);
|
||||
|
||||
watch(modelValue, newValue => {
|
||||
v.value = newValue;
|
||||
@@ -143,7 +145,9 @@ watch(modelValue, newValue => {
|
||||
|
||||
watch(v, () => {
|
||||
if (!props.manualSave) {
|
||||
if (props.debounce) {
|
||||
if (props.throttle === true || typeof props.throttle === 'number') {
|
||||
throttledUpdated();
|
||||
} else if (props.debounce === true || typeof props.debounce === 'number') {
|
||||
debouncedUpdated();
|
||||
} else {
|
||||
updated();
|
||||
|
||||
Reference in New Issue
Block a user