일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- Python
- Singleton pattern
- v-show vs v-if
- design pattern
- $event.target.value
- data
- Factory Method Pattern
- zen of python
- IPv6
- prototype pattern
- builder pattern
- click.native
- maven
- vuejs
- mount point
- ubuntu
- Linux
- java
- executable jar
- camel case error
- MVVM
- kebab case
- Spring Boot
- v-model vs v-bind
- Today
- Total
목록vuejs (6)
Eddie's Blog
input 엘리먼트에 v-model을 사용하여 Vue 인스턴스의 데이터를 바인딩하면 입력한 내용에 대해 모델 바인딩 바로 되지만, v-bind를 사용했을 경우 그렇지 못하기 때문에 $event.target.value를 사용하여 값을 가져와 oninput 이벤트에 데이터 값을 변경해준다. v-model = v-bind:value + v-on:input 라고 이해하자.
Vue.componet에 Vue인스턴스의 이벤트를 바인딩 하고자 한다면, .native를 사용해 연결한다.
Vue.js 2.x의 공식 가이드를 살펴보면 Vue.component 의 이름을 케밥 케이스(kebab-case)를 사용하고 있는데, 가이드 문서 중에 아래와 안내 문구를 발견할 수 있다. Note that Vue does not enforce the W3C rules for custom tag names (all-lowercase, must contain a hyphen) though following this convention is considered good practice. Vue는 W3C 규칙(모두 소문자와 하이픈만을 허용)을 강요하지 않습니다. 하지만 이런 규약이 좋은 습관이라고 생각합니다. 하지만, Vue.component의 이름을 카멜 케이스(camelCase: 원래 발음은 캐믈이라고 해..
Vue.component의 data는 함수형(function type)으로 객체(object)를 반환해서 사용해야 하고, Vue 인스턴스의 data는 객체(object)으로 사용한다.
1. logo.visible = true 인 경우 2. logo.visible = false 인 경우