mysql 샘플 테이블 + 쿼리 연습 문제

-
http://java-school.net/jdbc/SQL-SELECT-Statement CREATE TABLE DEPT (     DEPTNO DECIMAL ( 2 ),     DNAME VARCHAR ( 14 ),     LOC VARCHAR ( 13 ),     CONSTRAINT PK_DEPT PRIMARY KEY ( DEPTNO ) ); CREATE TABLE EMP (     EMPNO DECIMAL ( 4 ),     ENAME VARCHAR ( 10 ),     JOB VARCHAR ( 9 ),     MGR DECIMAL ( 4 ),     HIREDATE DATE ,     SAL DECIMAL ( 7 , 2 ),     COMM DECIMAL ( 7 , 2 ),     DEPTNO DECIMAL ( 2 ),     CONSTRAINT PK_EMP PRIMARY KEY ( EMPNO ),     CONSTRAINT FK_DEPTNO FOREIGN KEY ( DEPTNO ) REFERENCES DEPT ( DEPTNO ) ); CREATE TABLE SALGRADE (     GRADE TINYINT ,     LOSAL SMALLINT ,     HISAL SMALLINT ); INSE...

Vue.js document click 드롭다운 메뉴 닫기

-
Vue.js

document 클릭 이벤트
document click event

드롭다운 메뉴 바깥 클릭시 메뉴 닫기
click outside of drop down menu close the menu



* document.addEventListener()



<template> <div class="dropdown__menu" ref="dropdownMenu"> <div @click="visible = !visible" class="head__section"> <slot name="dropdown__head" ></slot> </div> <transition name="slide-y"> <div v-if="visible" class="dropdown__body"> <slot name="dropdown"></slot> </div> </transition> </div> </template> <script> export default{ props: ['position','align'], data(){ return{ positionClasses:'position_bottom align_center', visible:false, } }, methods:{ documentClick(e){ let el = this.$refs.dropdownMenu let target = e.target if ( el !== target) && !el.contains(target)) { this.visible=false } } }, created () { document.addEventListener('click', this.documentClick) }, destroyed () { document.removeEventListener('click', this.documentClick) } } </script>