想請問關於 skeleton pattern

Question

关于skeleton pattern

https://cloudcannon.com/decon...

想问这个载入的动画的实作, 目前有两种想法

1.)设计component的时候没有data的情况(component在完全没有data的时候)
2.)所有画面预设都是无资料状态的设计, 资料都是等画面载入后才读入
3.) &:empty
4.)故意延遲(setTimeout)

但虽然有想法, 实作完全没概念0.0......亦不知要用什么方式下去做, 在电脑桌前面坐了半天还是没搞头...

上网爬了很多文章, 都只有看到如何制作"loading动画", 动画目前对小弟来说较少障碍, 但逻辑上完全不知如何控制那个载入的时间点
(jquery有load但多进程的网页应用上估计是不管用)

目前是使用vue+sass做开发
有想到要用v-if/v-show 但不知道要如何控制那个对于loading的bo​​olean

如果有其他framework实作的方式也想请大神给小弟作为学习...

-

想请问各位大神有没有相关的经验?
或是对这个loading动画一般常用的方法?
或是提供小弟精准的关键字查询?

如果可以針對我提出的想法建議更好
非常感谢!!!

Answer 1

控制loading的bo​​olean:

$.ajax({
    beforeSend: function(){
     // loading
    },
    complete: function(){
     // loaded
    }
    // ......
});

Answer 2

谢邀。

但不是很能完全理解你想表达的意思，而且表述中存在一些问题，比如多进程的网站等。

看你是根据不同的内容进行占位符样式的设置还是统一的样式设置。如果是前者则很简单，如果是后者，有人评论是facebook使用的bigpipe技术，链接如下：

https://www.zhihu.com/questio...