vue3-dnd
Version:
Drag and Drop for Vue Composition API
27 lines (26 loc) • 921 B
JavaScript
import equal from "fast-deep-equal";
import { ref, unref, watchEffect } from "vue-demi";
/**
*
* @param monitor The monitor to collect state from
* @param collect The collecting function
* @param onUpdate A method to invoke when updates occur
*/ export function useCollector(monitor, collect, onUpdate) {
var collected = ref(unref(collect)(unref(monitor)));
var updateCollected = function() {
var nextValue = unref(collect)(unref(monitor));
// This needs to be a deep-equality check because some monitor-collected values
// include XYCoord objects that may be equivalent, but do not have instance equality.
if (!equal(collected.value, nextValue)) {
collected.value = nextValue;
if (onUpdate) {
onUpdate();
}
}
};
watchEffect(updateCollected);
return [
collected,
updateCollected
];
}