背景

额，我是一名Java程序猿，不是专业前端工程师，尽管我弄过Android，想要制作一个web页面，想要兼容桌面端和移动端。嗯，目的很美好！

过程

项目经理说：

“我们来找一款跨屏的前端HTML5框架吧”。

带着这个想法，问了问以前的前端同事，他们的回复基本上是：

“现在不使用JQuery了，都使用Vue了。”

这个时候，以为Vue能够解决跨屏的问题。使用VueJS了一段时间后，发现VueJS是对JQuery的替代，VueJS和JQuery并不是一个时代的产物（原谅我肤浅的前端理解，毕竟我不是专业前端工程师）。如同VueJS官网首页，所说

The Progressive JavaScript Framework

它还只是一个JavaScript框架而已，并不能解决产品经理想要解决掉跨屏问题。 还是不死心，翻看了一下VueJS推荐的一些优秀的资源发现了：，它自己的介绍中一段文字吸引了我，如下:

Vuetify supports all modern browsers, including IE11 and Safari 9+ (using polyfills). From mobile to laptop to desktop, you can rest assured that your application will work as expected. Interested in the bleeding edge? Try the vue-cli Webpack SSR (Server side rendered) template and build websites optimized for SEO.

大概的意思就是vuetify支持所有现代浏览器，包括桌面端和移动端。看到这里的时候，很是激动，终于找到了跨屏框架了（其实，这里vuetify都说了是现代浏览器，这意味着旧的机型是不支持的）。用这个vuetify搞了个页面，在桌面端和iOS都没有问题，最终vuetify面对老旧的米3机型，还是跪了。 vuetify不过确实很优秀，遵循Google的 ****的设计风格，然后，只需要在它的自定义组件上面稍加类似Android对屏幕宽度配置就可以解决了跨屏问题，这其实就是Google一直都遵循的Material设计规范来包装多屏体验一直的跨屏方案，也就是再产品平面和交互设计阶段已经对多屏进行了设计风格约束。

参考：