글

라벨이 vue.js 데이터 변경인 게시물 표시

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 변경된 데이터 적용하기

이미지
Vue.js  전체 리스트에서 검색결과만 보여주고싶다. 검색조건 - 부모 컴포넌트 리스트 - 자식 컴포넌트 1. 부모 컴포넌트(검색조건)에서 이벤트(검색클릭)가 일어났을 때 -> 2. 자식 컴포넌트에게 데이터를 보내줌 -> 3. 자식 컴포넌트가 데이터 변경을 감지 -> 4. 변경된 데이터 뿌려줌 1. api 호출 하고 받아온 데이터를 data에 세팅 부모컴포넌트.vue <script> data () { return { rows: [] } }, methods: { getList () { let param = { s_user_id: this . user_id , s_user_nm: this . user_nm , s_group_cd: this . group_cd } console . log ( param ) user . getUserListOption ( ( data ) => { this . rows = data }, param ) } } </script> 2. 템플릿에 CList 컴포넌트 에서 v-bind로 데이터를 바인딩 해준다 부모컴포넌트.vue <template> < CList name = "list" class = "default" v-bind:new-data =" rows " ></ CList > </template> 3. props로 부모컴포넌트에서 바인딩해준 데이터를 받아온다. 4. watch 데이터가 변경된게 있으면 기존 rows를 새 데이터로 세팅해준다. 자식컴포넌트.vue <script> props: [ 'newData' ], data () { r...