数据可视化大屏 页面都会有一个特色的头部,用来放标题时间以及菜单等效果,为了方便复用可能会出现的头部,这里将可能会遇到的 数据可视化大屏头部组件 都整理出来方便复用。今天整理的来自数据大屏:固废全过程 头部组件。
效果截图
帧动画效果
通过ae实现从两侧到中间的扫光动画,使用帧...
yekong
1年前 (2023-06-16)
喜欢
vue 数据可视化大屏 项目开发中,为了数据安全,需要对数据进行加解密,后端返回加密数据,前端进行解密然后做后续处理。
安装依赖
因为数据是长数据,所以这里直接使用的是encryptlong
pnpm i encryptlong
引用
import JSEncrypt from...
yekong
1年前 (2023-06-15)
喜欢
vue数据可视化大屏项目开发中,有一个区域数据很多,需要滚动到底部后进行数据分页加载。
div部分
<div class="cBodys hideScrollBar" ref="cBodys">
<div clas...
yekong
1年前 (2023-06-13)
喜欢
vue外包项目 中在与后端进行数据调用的时候,会遇到需要二次处理后端返回数据的情况,比如对一组数据进行排序,这时候我们可以通过一个方法对数据进行排序处理。
从小到大排序
function sortKey(array, key) {
return array.sort(fu...
yekong
1年前 (2023-06-11)
喜欢
1.插槽描述
插槽是 Vue 提出来的一个概念,插槽用于决定将所携带的内容,插入到指定的某个位置,从而使模板分块,具有模块化的特质和更大的重用性。插槽显不显示、怎样显示是由父组件来控制的,而插槽在哪里显示就由子组件来进行控制.
2.插槽分类
插槽分为三种:
默认插槽
具名插槽
作...
yekong
1年前 (2023-06-10)
喜欢
vue3 可视化数据大屏开发中,为了让大屏效果更加酷炫,会给大屏增加很多动画,这里也增加wow.js来实现动画效果,但是在实际项目开发中会出现重复触发动画的效果,页面加载后会触发一次动画,请求完接口后又触发了一次动画,这就不是很友好了。
问题
于是经过一段排查,发现只有特定组件存...
yekong
1年前 (2023-06-09)
喜欢
vue3 数据可视化大屏项目开发中,需要一个登录功能,token的有效期只有30分钟,所以经常需要登录,如果每次登录都要重新手动进入自己要开发的页面的话,就太麻烦了,所以当token过期后,我们就需要先记录当前的地址,登录成功后自动跳转到之前的页面,而不需要重新手动跳转了。
获取...
yekong
1年前 (2023-06-09)
喜欢
vue3项目开发中,在进行接口请求的时候,有鉴权,需要判断是否401,如果报401则跳转到登录页。
封装代码
import axios from 'axios'
import {devIp} from '@/api/ipConfig'
import router from &qu...
yekong
1年前 (2023-06-06)
喜欢
vue3 数据大屏 项目开发中,需要一个世界国家列表并且可以通过输入关键字进行筛选的功能,这里使用element-plus el-select组件来实现的我们的功能。
要筛选的话,首先需要整理国家的名称,这里整理了中英文国家数据
使用组件传值
<template>
...
yekong
2年前 (2023-05-26)
喜欢
vue3 数据可视化大屏 开发中,需要进行内容切换,因为很多个模块都需要切换,所以把这一块的代码单独抽离出来不用再额外花费精力来关心切换了。这样就只需要集中精力处理逻辑即可。
代码
<template>
<div class="itemOutBo...
yekong
2年前 (2023-05-25)
喜欢