Abstract to useKeydown composition API

This commit is contained in:
Jeffrey Biles
2020-03-29 16:09:26 -07:00
parent 9c26bfae90
commit 84c16230b4
2 changed files with 19 additions and 12 deletions

View File

@@ -8,21 +8,11 @@
</template>
<script>
import { onBeforeUnmount } from 'vue';
import { useKeydown } from '../composition/useKeydown';
export default {
setup({closeModal}){
let onKeydown = (event) => {
if(event.key == 'Escape') {
closeModal()
}
}
window.addEventListener('keydown', onKeydown)
onBeforeUnmount(() => {
window.removeEventListener('keydown', onKeydown)
})
useKeydown({key: 'Escape', fn: closeModal})
},
props: {
closeModal: {

View File

@@ -0,0 +1,17 @@
import { onBeforeUnmount } from 'vue';
export const useKeydown = function(keyCombo) {
let onkey = function(event) {
if(keyCombo.key == event.key) {
keyCombo.fn()
}
}
window.addEventListener('keydown', onkey);
onBeforeUnmount(()=> {
window.removeEventListener('keydown', onkey);
})
}
export default useKeydown;