摘要： <template> <div @click="flag = !flag">switch</div> <transition appear appear-from-class="from" appear-active-class="active" appear-to-class="to"> <div 阅读全文

摘要： <template> <div @click="flag = !flag">switch</div> <transition name="fade" @before-enter="beforeEnter" @enter="enter" @after-enter="afterEnter" @enter 阅读全文

摘要： <template> <div @click="flag = !flag">switch</div> 不根据name来设置动画效果,指定自定义的class名 <transition :duration="{ enter: 1000, leave: 5000 }" enter-active-class 阅读全文

摘要： <template> <div @click="flag = !flag">switch</div> <transition name="fade"> <div v-if="flag" class="box">Hello World</div> </transition> </template> < 阅读全文

摘要： <template> include是指缓存的组件,如果不写,则所有组件都会被缓存 exclude是指不缓存的组件,如果不写,则所有组件都会被缓存 <keep-alive include="A"> <A v-if="showA" /> <B v-else /> </keep-alive> <butt 阅读全文

摘要： <template> <div class="warp"> // body是指将teleport组件挂载到body上,to可以写元素名/类名/ID名 <teleport to='body'> <TeleportComponent /> </teleport> </div> </template> < 阅读全文

摘要： <template> 实现骨架屏效果 <Suspense> <template #default> <sync /> </template> <template #fallback> <skeleton /> </template> </Suspense> </template> <script s 阅读全文

摘要： <template> <SlotComponent> <!-- <template v-slot>123</template> --> <template #default>不同写法</template> <!-- <template v-slot:middle>456</template> --> 阅读全文

摘要： <template> <component :is='component'></component> </template> <script setup lang='ts'> import { ref, shallowRef } from 'vue' import A from './A.vue' 阅读全文

摘要： import { createApp } from 'vue' import './style.css' import App from './App.vue' import SelfComponent from './study/selfComponent/component.vue' const 阅读全文