ドラッグ中ずっとAPIを更新し続けるのを修正
This commit is contained in:
parent
771bf9a0f6
commit
dfdf714cf9
|
@ -123,7 +123,10 @@ import MkEmoji from '@/components/global/MkEmoji.vue';
|
||||||
import MkFolder from '@/components/MkFolder.vue';
|
import MkFolder from '@/components/MkFolder.vue';
|
||||||
|
|
||||||
const pinnedEmojisForReaction = ref<string[]>(deepClone(defaultStore.state.reactions));
|
const pinnedEmojisForReaction = ref<string[]>(deepClone(defaultStore.state.reactions));
|
||||||
|
const isPinnedEmojisForReactionDragging = ref(false);
|
||||||
|
|
||||||
const pinnedEmojis = ref<string[]>(deepClone(defaultStore.state.pinnedEmojis));
|
const pinnedEmojis = ref<string[]>(deepClone(defaultStore.state.pinnedEmojis));
|
||||||
|
const isPinnedEmojisDragging = ref(false);
|
||||||
|
|
||||||
const emojiPickerScale = computed(defaultStore.makeGetterSetter('emojiPickerScale'));
|
const emojiPickerScale = computed(defaultStore.makeGetterSetter('emojiPickerScale'));
|
||||||
const emojiPickerWidth = computed(defaultStore.makeGetterSetter('emojiPickerWidth'));
|
const emojiPickerWidth = computed(defaultStore.makeGetterSetter('emojiPickerWidth'));
|
||||||
|
@ -140,6 +143,13 @@ dragAndDrop({
|
||||||
draggable: (el: HTMLElement) => {
|
draggable: (el: HTMLElement) => {
|
||||||
return !el.classList.contains('no-drag');
|
return !el.classList.contains('no-drag');
|
||||||
},
|
},
|
||||||
|
onDragstart: () => {
|
||||||
|
isPinnedEmojisForReactionDragging.value = true;
|
||||||
|
},
|
||||||
|
onDragend: () => {
|
||||||
|
isPinnedEmojisForReactionDragging.value = false;
|
||||||
|
defaultStore.set('reactions', pinnedEmojisForReaction.value);
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
dragAndDrop({
|
dragAndDrop({
|
||||||
|
@ -149,6 +159,13 @@ dragAndDrop({
|
||||||
draggable: (el: HTMLElement) => {
|
draggable: (el: HTMLElement) => {
|
||||||
return !el.classList.contains('no-drag');
|
return !el.classList.contains('no-drag');
|
||||||
},
|
},
|
||||||
|
onDragstart: () => {
|
||||||
|
isPinnedEmojisDragging.value = true;
|
||||||
|
},
|
||||||
|
onDragend: () => {
|
||||||
|
isPinnedEmojisDragging.value = false;
|
||||||
|
defaultStore.set('pinnedEmojis', pinnedEmojis.value);
|
||||||
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
const removeReaction = (reaction: string, ev: MouseEvent) => remove(pinnedEmojisForReaction, reaction, ev);
|
const removeReaction = (reaction: string, ev: MouseEvent) => remove(pinnedEmojisForReaction, reaction, ev);
|
||||||
|
@ -229,12 +246,14 @@ function getHTMLElement(ev: MouseEvent): HTMLElement {
|
||||||
}
|
}
|
||||||
|
|
||||||
watch(pinnedEmojisForReaction, () => {
|
watch(pinnedEmojisForReaction, () => {
|
||||||
|
if (isPinnedEmojisForReactionDragging.value) return;
|
||||||
defaultStore.set('reactions', pinnedEmojisForReaction.value);
|
defaultStore.set('reactions', pinnedEmojisForReaction.value);
|
||||||
}, {
|
}, {
|
||||||
deep: true,
|
deep: true,
|
||||||
});
|
});
|
||||||
|
|
||||||
watch(pinnedEmojis, () => {
|
watch(pinnedEmojis, () => {
|
||||||
|
if (isPinnedEmojisDragging.value) return;
|
||||||
defaultStore.set('pinnedEmojis', pinnedEmojis.value);
|
defaultStore.set('pinnedEmojis', pinnedEmojis.value);
|
||||||
}, {
|
}, {
|
||||||
deep: true,
|
deep: true,
|
||||||
|
|
Loading…
Reference in New Issue