使用vue做一个雪碧图组件

1.什么是雪碧图：

    雪碧图就是将很多很多的小图标放在一张图片上，就称之为雪碧图。

2.使用雪碧图的优缺点：

    优点：a.减少http请求次数

              b.减少图片大小，提升网页加载速度 (多张图片加载速度小于拼合成的图片的 加载速度)；

              c.易于后期的维护；

              d.更换风格方便，只需要在一张或少张图片上修改图片的颜色或样式

    缺点： a.在图片合成的时候，要把多张图片有序、合理的合并成一张图片，还要留好足够的空间，防止板块内出现不必要的背景；

               b.由于图片的位置需要固定为某个绝对数值，这就失去了诸如center之类的灵活性;

3. 使用示例：

（最近在重构项目的时候，发现项目中的图标很零散，就想到了使用雪碧图来整合，下面是封装起来的一个vue组件，供大家参考）

4. 使用：

为了使用方便，可以将该组件放到全局变量中，比如自定义为，便可通过下面方式来使用：

     //   row代表着行数，column代表列数

转载于:https://my.oschina.net/zoujinxia/blog/1982386