我们在进行前端开发中必然会遇到PC与移动端的适配,面对这样的问题有些公司会准备两个页面,移动是移动,PC是PC,而响应式布局就是根据用户不同的机型展示不同的页面,废话不多说,直接贴代码首先我们这个功能是借助vuex实现的,没下载的小伙伴可以先下一个既然是响应式布局就要准备两套css,一个是PC端的css,一个是移动端的css,我们暂且将PC端的样式称为computer,移动端的样式称为mobile我们首先要做的就是当前屏幕的宽度这是vuex的state,我们后续还要实时监控屏幕宽度,所以还需要提供一个改变screenWidth的方法,于是我又写了一mutations这样我们的vuex的文件就写

vue-cli中实现响应式布局的方法

vue-cli中实现响应式布局的方法