[vue]基于vue的响应式HTML img截取显示效果

>问题描述

vue是一个学习曲线相对平缓的响应式框架，利用vue可以做到素材图片的动态裁剪、切换。

将本文要解决的问题抽象成基本原型进行描述：下图，为一个尺寸相对固定的素材图片，实现的目标是每次只实现一格图片，如下所示：

 -----》 

同时，还要做到页面的动态响应。

>解决思路

问题的难度就演变成了如何实现图片的“切片效果”以及动态响应。

切片问题还算简单，利用div+img，div套用overflow:hidden的style，然后内嵌的img