1、在进度条宽度变化的时候,计算盖过每一个文字的50%,如果超过,设置文字相反颜色。当然css也有对应的方案,也就是 mix-blend-mode,我并没有接触过。对应html也有对应方案,也就设置两个相同位置但是颜色相反的dom结构在重叠在一起,顶层覆盖底层,最顶层的进度条取overflow为hidden,其宽度就为进度。
2、![](https://img.haomeiwen.com/i11259201/c5be54604cae45e2.png)
- vue 响应式原理:
es5里面新增了一个叫 object.defineproperty的api 他可以对对象进行操作,带有一个set 和 get 方法,来进行数据的获取和设置,那在这里我们就可以插入一些触发更新的方法,
使用 发布订阅模式 来阐述一下这个部分:
多个订阅者可以向同一个发布者订阅一个事件,那么等有新的订阅者的时候,我们就把这个订阅者加入到发布者创建的队列里边,当发布者的事件有变化的时候我们就通知所有的订阅者更新事件,由此订阅者就能看到最新的事件。 以下发出一段代码能有效理解这段话:
注: subs 数组是订阅者队列;
![](https://img.haomeiwen.com/i11259201/6488811c09623d36.png)
https://www.cnblogs.com/chenjg/p/9541291.html
4.
![](https://img.haomeiwen.com/i11259201/87f17cb03a24def3.png)
5.
![](https://img.haomeiwen.com/i11259201/40e7ec4d65ade8b3.png)
网友评论