数据大屏开发中，需要监听实时消息，消息是使用的，最新的项目中获取ws数据的方法：vue项目中请求WebSocket获取数据
公共方法
function getSocket(url, params, callback) {
let socket;
if (typeof (...
yekong
7个月前 (10-17) 1794℃
0喜欢
数据大屏开发中，需要实现一个步骤条的效果，但是步骤条的长度可能会很大超过了当前显示区域，所以我们需要一个可以鼠标横向拖动的效果。
动态拖动效果
开发环境
vue2 webpack js
使用插件
"@better-scroll/core": "^...
yekong
7个月前 (10-17) 346℃
0喜欢
数据大屏项目在调试开发中可能会需要指定调试端口号，以便于不和其他项目的端口冲突。
这里我们找到vue.config.js文件
关键代码
这里我们指定8083为端口号
devServer: {
port: 8083// 设置端口为8083
},
完整实例代码
'use s...
yekong
7个月前 (10-14) 296℃
0喜欢
vue项目在开发中经常会使用到弹窗组件，但是在使用弹窗组件的时候会遇到一个问题就是当组件有很多，而弹窗组件又在子组件中时，会出现弹窗层级太低出现错位等问题，这时候我们就需要考虑让弹窗组件在最外层不会受到子组件的影响。
关键代码
我们在写组件的时候，可以加入以下代码，将组件插入到...
yekong
7个月前 (10-13) 613℃
0喜欢
vue3 数据可视化大屏项目中，设计师会设置类似下图的效果，这里我们使用element-plus的el-select来实现我们想要的效果，不过el-select使用的是字体图标，我们需要对其进行修改
关键代码
我们需要先给el-select定义一个class样式el-selec...
yekong
7个月前 (10-07) 811℃
0喜欢
可视化大屏 项目开发中，会需要自定义el-select样式，当我们选中el-select后，会出现一个蓝色边框，这个边框并不是我们想要的，需要进行移除。通过检查样式会发现一个样式--el-select-input-focus-border-color，将这个样式设置none就可以...
yekong
7个月前 (10-07) 473℃
0喜欢
2023年10月01日更新
百度地图官网api已更新，vue-baidu-map使用的api已过时，推荐使用最新的百度地图api:vue项目中使用百度地图
新版本和旧版本对比：就目前的使用体验旧版本在使用自定义颜色地图的时候加载瓦片图经常出现空白，用户体验很不好，所以这里推荐使用...
yekong
7个月前 (10-01) 358℃
0喜欢
vue数据可视化大屏项目中，客户的数据大屏是投放到电视上的，不用操作，所以客户想每隔5秒请求一次接口刷新数据。
配置文件增加定时间隔
因为数据大屏项目中有很多接口，所以我们需要将定时间隔抽离出来，下次如果修改定时请求间隔或者不要定时请求了我们只需要修改配置文件就可以了。
我们在s...
yekong
7个月前 (09-29) 434℃
0喜欢
要在 Vue 2 项目中使用 mockjs，你可以按照以下步骤进行：
安装 mockjs
使用 npm 或 yarn 安装 mockjs:
npm install mockjs --save-dev
或
yarn add mockjs --dev
创建一个 mock 数据文件...
yekong
8个月前 (09-18) 352℃
0喜欢
数据可视化大屏项目开发过程中会在大屏顶部左侧或者右侧显示实时的日期时间，效果如下：
首先需要安装并配置dayjs库，并导入必要的插件以支持显示星期。接着，在Vue组件中设置一个定时器来实时更新时间。
安装 dayjs
npm install dayjs
配置 dayjs
在V...
yekong
8个月前 (09-17) 537℃
1喜欢
