在加载列表数据时加载微调器

Question

我有一个手风琴，我正在使用其中包含很多li列表的ul li列表。当用户单击手风琴以查看数据时，我想在从服务器获取数据时显示加载程序。提取数据后，加载程序将隐藏并显示数据。 预先感谢。

   Here is codepen: https://codepen.io/uibeast/pen/rXNePa

Answer 1

_loader-bar.sass

.loader-bar

//之前用于数据文本属性   ＆[data-text]：之前     顶部：calc（50％-40px）     颜色：$ loader-bar--text-color

＆：之后     内容：''     位置：固定     最高：50％     左：50％     宽度：200像素     高度：20px     变换：翻译（-50％，-50％）     背景：线性渐变（-45deg，$ loader-bar--color-secondary 25％，$ loader-bar--color 25％，$ loader-bar--color 50％，$ loader-bar--color-secondary 50％，$ loader-bar-color-secondary 75％，$ loader-bar-color 75％，$ loader-bar-color）     背景尺寸：20px 20px     框阴影：插入0 10px 0 rgba（255，255，255，.2），0 0 0 5px rgba（0，0，0，.2）     动画：moveBar 1.5s线性无限反向

＆[数据四舍五入]     ＆：后       边框半径：15px

＆[反向数据]     ＆：后       动画方向：正常

//酒吧动画 @keyframes moveBar   从     背景位置：0 0

到     背景位置：20px 20px

loader-bar.sass

中的下一步

@import'./config'

@import'./general/base'

@import'./loaders/loader-bar'