作者:柯韵亚 | 来源:互联网 | 2024-10-08 10:14
问题1:chosen插件无法显示图标问题现象在我本地调试的时候,我使用了一个多选下拉框的插件,就是chosen,不知道为什么,这个多选框上面的图标不见了。我找了半天没有找到原因,然
问题1:chosen插件无法显示图标
问题现象
在我本地调试的时候,我使用了一个多选下拉框的插件,就是chosen, 不知道为什么,这个多选框上面的图标不见了。我找了半天没有找到原因,然后我把我的机器的内网地址给我同事,让他访问我机器,当它访问到这个页面时。他的电脑上居然显示出了这个下拉框的图标。
这是什么鬼?
, 为什么同样的代码,在我的电脑上显示不出图标,但是在他的电脑上可以显示。有句名言说的好:没有什么bug是一遍调试解决不了的,如果有,就再仔细调试一遍
。于是我就再次调试一遍。
我发现了一些第一遍没有注意到的东西媒体查询
,就是在css里有这样的语句:
@media
从这里作为切入口,我发现:媒体查询的类会覆盖它原生的类的属性
由于我的电脑视网膜屏幕,分辨率比较高,触发了媒体查询,这就导致了媒体查询的类覆盖了原生的类。而覆盖后的类,使用了chosen-sprite@2x.png
作为图标的背景图片。但是这个图片并没有被放在这个插件的目录下,有的只有chosen-sprite.png
这个图片。在一般情况下,都是用chosen-sprite.png
作为背景图片的。这就解释了:为什么同事的电脑上出现了图标,但是我的电脑上没有出现这个图标。
总结: 如果你要使用一个插件,你最好把这个插件的所有文件都放在同一个目录下。而不要只放一些你认为有用的文件。最后:媒体查询的相关知识也是必要的。
问题2:jQuery 与 Vue之间的暧昧
jQuery流派代表着直接操纵DOM的流派,Vue流派代表着操纵数据的流派。
如果在项目里,你使用了一些jQuery插件,也使用了Vue,这就可能导致一些问题。
举个例子:
总结:如果你在Vue项目中逼不得已使用jQuery, 你要知道这会导致哪些常见的问题,以及解决思路。
最后
我苦苦寻找诡异的bug原因,其实是我的无知。