조건부 렌더링
-
[vue.js] v-show, v-if, v-elsevue.js 2019. 7. 3. 18:47
1. 조건부 렌더링 조건부 렌더링이란 조건에 따라 다르게 렌더링 할 수 있는 것을 말하며, v-show, v-if, v-else, v-else-if 가 있다. 2. v-show v-show는 조건 상태값에 따라 결과값이 보이고 보이지 않게 된다.. 즉 display의 css 속성을 토글해 보여주거나 감추는 것이다. v-show="조건상태" 이렇게 쓸 수 있다. 예를 들어 어떤 글자가 꼭 입력이 되야만 생성되는 버튼을 만든다고 한다면 다음과 같이 v-show 디렉티브를 이용해 만들 수 있다. 저번에 포스팅했던 v-model 을 이용해 textarea를 message 변수와 바인딩 해서 메세지를 표시한다. 그리고 button에 v-show="조건상태" 를 입력하여 textarea에 글이 있으면 버튼이 보이게..