Vue自适应所有屏幕大小，目前页面自适应，尤其是数据可视化大屏的自适应更是案例很多

今天就记录一下使用Vue全局自适应各种屏幕大小的功能

在Vue.js中创建一个数据大屏，并使其能够自适应不同屏幕大小，通常涉及到布局的响应式设计、CSS媒体查询、以及利用Vue的事件系统来处理窗口大小变化。下面我将展示一个使用Vue2、Vuetify（一个基于Material Design的Vue UI框架）和Vuex（Vue的状态管理库）来构建响应式数据大屏的示例。

项目结构

1.src/components/DataScreen.vue - 数据大屏的主要组件。

2.src/store/index.js - Vuex store，用于管理应用状态。

3.src/main.js - 应用入口文件。

第一步：安装依赖

首先，确保你有一个Vue 2项目。然后安装Vue