1.开发环境 vue
2.电脑系统 windows11专业版
3.在开发的过程中,咱们在获取数据的时候常常会应用增加loading来让用户体验更好,上面我来分享一下。
4.废话不多说,间接上代码:
// template <transition name="fade"> <div class='g-loading-plan' v-if="isLoadingData"> <p class="loadingText">loading...</p> </div> </transition>// css款式如下.g-loading-plan { position: fixed; z-index: 1010; background-color: rgba(0, 0, 0, 0.6); top: 0; bottom: 0; left: 0; width: 100%; display: flex; justify-content: center; align-items: center; flex-flow: row nowrap; .loadingText { color: #fff; font-size: 24px; }}4-1.成果如下:
5.本期的分享到了这里就完结啦,心愿对你有帮忙,让咱们一起致力走向巅峰。