-
질문 & 답변
카테고리
-
세부 분야
프론트엔드
-
해결 여부
미해결
transition 문의
22.07.31 23:32 작성 조회수 140
1
- - 학습 관련 질문을 남겨주세요. 상세히 작성하면 더 좋아요!
- - 먼저 유사한 질문이 있었는지 검색해보세요.
- - 서로 예의를 지키며 존중하는 문화를 만들어가요.
- - 잠깐! 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.
안녕하세요.
transition 관련 문의 좀 드리려고 합니다.
1. transition group 사용 시, name은 무조건 list로 사용하는 건가요,?
2. transition 효과는 TodoList에 정의되어 있고, clearAll이나 List 추가하는 함수는 상위 컴포넌트(App)가 받아서 처리하는데 transition 효과가 적용되는 건가요?
감사합니다.
답변을 작성해보세요.
0
장기효(캡틴판교)
지식공유자2022.08.01
안녕하세요,
1. name은 아무거나 사용하시면 됩니다. 다만, 트랜지션 효과를 적용할 클래스 & 스타일과 name이 서로 관계가 있습니다.
`<transition name="component-fade" mode="out-in">
<component v-bind:is="view"></component>
</transition>`.component-fade-enter-active, .component-fade-leave-active { transition: opacity .3s ease; } .component-fade-enter, .component-fade-leave-to /* .component-fade-leave-active below version 2.1.8 */ { opacity: 0; }
2. 상위 컴포넌트에서 TodoList에게 데이터를 내려줄 뿐이지 TodoList 자체에 트랜지션 효과가 적용되어 있는 건 변함이 없습니다. 요건 TodoList에 트랜지션이 아니라 color: red; 라는 간단한 css 스타일이 적용되어 있다고 생각해 보시면 더 이해하시기 쉬울 것 같네요 :)
답변 1