@stackoverfloweth/vue-compositions
Version:
A collection of reusable vue compositions.
31 lines • 992 B
JavaScript
import { getCurrentInstance, isRef, onUnmounted, ref, unref, watch } from 'vue';
/**
* @deprecated use useMedia instead
*/
export const media = useMedia;
export function useMedia(query) {
let mediaQuery = window.matchMedia(unref(query));
const matches = ref(mediaQuery.matches);
let unwatch;
function updateMatches(event) {
matches.value = event.matches;
}
mediaQuery.addEventListener('change', updateMatches);
if (isRef(query)) {
unwatch = watch(query, () => {
mediaQuery.removeEventListener('change', updateMatches);
mediaQuery = window.matchMedia(unref(query));
mediaQuery.addEventListener('change', updateMatches);
});
}
if (getCurrentInstance()) {
onUnmounted(() => {
mediaQuery.removeEventListener('change', updateMatches);
if (unwatch) {
unwatch();
}
});
}
return matches;
}
//# sourceMappingURL=useMedia.js.map