Object resultObj = gson.fromJson(fileReader, Object.class); // gson의 fromJson메서드의 첫번째 파라미터로는 Reader를 두번째 파라미터로는 Json 데이터 타입을 넘겨주면 된다.
// Map map = (Map) gson.fromJson(fileReader, Object.class); // 타입을 Object로 하고 casting 가능 // Map map = gson.fromJson(fileReader, Map.class); // 타입을 바로 Map으로 해서 casting 없이 사용 가능 } catch(Exception e) {
} finally { fileReader.close(); } }
설명
해당 소스코드는 구글에서 제공하는 Gson을 이용해서 parse를 한다. Gson의 fromJson은 첫번째 파라미터로 Reader와 두번째 파라미터로 데이터 타입을 받는다. 두번째 파라미터로 Object.class를 넘겨주니 모든 데이터 타입(원시 타입 포함)의 값을 오류없이 가져올수 있었다.
gson.fromJson(Reader, Type) : JSON 파일로 부터 데이터 가져오기 gson.fromJson(String, type) : JSONString 으로부터 각 데이터 타입으로 변환
FileReader/FileWriter는 인코딩 설정이 불가능 하므로 FileInputStream/FileOuputStream을 쓰자 많은 양의 데이터를 입출력 할시에 Buffer를 쓰는것과 안 쓰는것의 차이가 크다 => 버퍼를 쓰자 InputStream/OutputStream은 단위가 바이트단위라서 한글이 깨지므로 InputStreamReader/OutputStreamReader를 쓰자
Vue.component를 사용하는 전역 컴포넌트로는 구조 파악이나 스타일 적용등에 있어서 어려움이 많아서 복잡한 뷰 프로젝트에서 사용하기가 힘듭니다. 그래서 .vue 파일로 프로젝트를 구성하는 방식인 싱글파일컴포넌트를 사용합니다. 1개의 .vue파일은 1개의 컴포넌트가 됩니다.
조건에 따라서 화면에 보이거나 숨겨야 하는 경우 v-if를 사용하면 좋습니다. 하지만 토글기능을 사용해야 할 경우에는 렌더링을 다시 해주어야 하기 때문에 v-if 보다는 v-show가 좋을수있습니다. template 태그에서도 사용가능합니다.(template 태그 그 자체는 사용해도 화면에 렌더링 되지 않고 내부 자식 태그들만 렌더링 해줍니다.)
2. v-show
v-show는 v-if랑 비슷한 역할을 합니다. v-if랑 다른 건 렌더링은 모두 하지만 숨기고 보이는 건 css의 display none 속성을 사용합니다. v-if와 마찬가지로 조건을 만족하면 화면에 보이고 만족하지 않으면 보이지 않습니다.
1
<div v-show="true">v-if를 사용해보겠습니다.</div>
잦은 보이거나 숨기는 기능을 사용하게 된다면 v-show를 사용하면 좋습니다(렌더링을 다시 하는 것보단 css로 none또는 block하는게 더 효율적). v-show는 초기 렌더링 비용이 높기 때문에 유의 해야 합니다.
3. v-for
v-for는 지정한 뷰 데이터의 개수만큼 해당 HTML 태그를 반복해서 출력 합니다. 대상은 Array뿐아니라 Object도 가능합니다.
v-bind는 HTML 속성 값에 데이터를 바인딩하거나 하위 컴포넌트의 props 속성에 값을 바인딩 할때 사용합니다. 사용방법은 v-bind:속성명="데이터" 또는 축약으로 :속성명="데이터"으로도 사용가능합니다.
1 2
<divv-bind:id="type"></div><!-- 데이터 type의 값이 바인딩 됩니다. --> <divv-bind:id="'type'"></div><!-- type이라는 문자열으로 설정합니다. -->
class 속성에 객체를 전달할 수도 있습니다. 객체를 활용하면 여러개의 class를 쉽게 바인딩 할수 있습니다. 객체의 값이 true면 해당 객체의 key명이 class로 지정됩니다.
1 2
<divv-bind:class="{active: true}"></div> <divv-bind:class="{active: true, on: true}"></div>
5. v-model
v-model은 form에서 주로 사용되는 속성입니다. 폼에 입력한 값을 뷰의 데이터와 바인딩하는 역할을 합니다. 다른 디렉티브와는 다르게 양방향으로 바인딩 되기 때문에 input에 값을 입력하면 뷰의 데이터도 변경이 됩니다. v-model에서 사용하는 태그는 input, select, textarea 등이 있습니다.
1
<inputtype="text"v-model="value">
여러 체크박스를 하나의 배열로 바인딩 할수 있습니다. 체크를 하게 되면 배열에 하나씩 추가 됩니다.
.prevent 수식어를 통해서 event.preventDefault() 역할을 대신 할수있습니다.
1
<formv-on:submit.prevent="onSubmit"></form>
.once 수식어는 최대 한번만 실행 가능하도록 설정합니다.
1
<formv-on:submit.once="onSubmit"></form>
키에 대한 수식어를 사용 가능합니다. 종류에는 .enter, .tab, .delete(Delete와 Backspace 모두), .esc, .up, .down, .left, .right가 존재하며 config.keyCodes를 통해서 사용자 정의 키 수식어를 만들수도 있습니다.
1
<inputtype="text"v-on:keyup.enter="onSubmit">
수식어는 체이닝이 됩니다. 이벤트는 기본이벤트 뿐 아니라 사용자 정의 이벤트도 사용가능합니다.
데이터 바인딩 할때 사용이 가능합니다. template 영역에도 {{}}를 사용해서 데이터 바인딩이 가능합니다. 데이터 타입은 number, string, object, array등 모두 가능합니다. 뷰 인스턴스의 메서드 속성에서 this.data키 로 접근 가능합니다.
