쓰기

1. 스크립트태그에 인라인속성 추가 th:inline="javascript" 2. 스크립트 시작과 끝에 CDATA 반드시 선언 /* ... /* ]]> */ 3. ${}를 주석으로 감싸기 HTML에서는 ${}, 자바스크립트에서는 /*[[ ${} ]]*/

v-for 지시자에 대한 vue컴파일러 경고 메세지 Module Warning (from ./node_modules/vue-loader/lib/loaders/templateLoader.js): (Emitted value instead of an instance of Error) : component lists rendered with v-for should have explicit keys. See https://vuejs.org/guide/list.html#key for more info. 콘솔에 위와 같이 Vue 컴파일러의 경고메세지가 나타난다면 v-for 지시자를 선언한 옆에 v-bind:key 또는 :key 지시자를 선언한다. (v-bind):key 지시자가 없어서 경고메세지 뜬 경우 (v-bin..

b-table 컴포넌트 사용 시 필드마다 사이즈 조정하기 b-table이 보다 편리하게 테이블을 생성할 수 있도록 많은 옵션을 제공하지만, 별도로 컬럼사이즈를 조절할 수 있는 방법이 없다. 컬럼마다 style 바인딩 해주기에는 너무 번거롭고 테이블 수도 많아서 쉽지 않다. 그래서 나는 thClass를 활용하기로 했다. 테이블을 사용하는 화면에서 b-table 컴포넌트를 바로 사용하는게 아니라, Table.vue 라는 컴포넌트로 한번 더 감싸주었다. 소스코드는 다음과 같다. SomeServices.vue /*********************************************************** - w10 ~ w95 까지 5단위로 컬럼의 width길이 조절 가능하다. - fields 데이터..

상위 컴포넌트에서 router path가 변경되어 하위 컴포넌트가 변경될 때 접근로그를 기록하기 위해서, 컴포넌트 내에서 router의 변경을 감지할 필요가 있었다. 상위 컴포넌트의 watch 함수에 $route를 정의함으로써 router-view가 변경될 때마다 감지할 수 있었다. watch: { $route(to, from) { // ..... } } - 상위 컴포넌트 : DefaultContainer - 하위 컴포넌트 : LoggingCenterContainer, LoggingCenterAccessLog, LoggingCenterActionLog router/index.js /* router/index.js */ const routes = { path: '/lc', component: Default..