vue外包项目 中在与后端进行数据调用的时候,会遇到需要二次处理后端返回数据的情况,比如对一组数据进行排序,这时候我们可以通过一个方法对数据进行排序处理。
从小到大排序
function sortKey(array, key) {
return array.sort(fu...
yekong
2年前 (2023-06-11)
喜欢
vue3 数据大屏 项目开发中,需要一个世界国家列表并且可以通过输入关键字进行筛选的功能,这里使用element-plus el-select组件来实现的我们的功能。
要筛选的话,首先需要整理国家的名称,这里整理了中英文国家数据
使用组件传值
<template>
...
yekong
2年前 (2023-05-26)
喜欢
vue3 数据可视化大屏 开发中,需要进行内容切换,因为很多个模块都需要切换,所以把这一块的代码单独抽离出来不用再额外花费精力来关心切换了。这样就只需要集中精力处理逻辑即可。
代码
<template>
<div class="itemOutBo...
yekong
2年前 (2023-05-25)
喜欢
vue 数据可视化大屏开发中,因为大屏都是一个一个的模块组成,除了实现效果外,我们还需要考虑组件的可移植性和复用性,避免因为数据导致组件使用混乱。尽可能做到组件拿来即用。
请求接口
首先组件封装,当前组件我们只做一件事请求接口,把接口的数据传给echarts子组件。
<te...
yekong
2年前 (2023-04-10)
喜欢
在vue项目中,echarts图表为了看起来酷炫,会使用渐变色效果,我们可以通过vue的计算属性来生成渐变色的代码,然后赋值给echarts.
生成渐变色
computed: {
colorList: function () {
var list = [{
...
yekong
2年前 (2023-04-10)
喜欢
vue vite项目中引入glsl文件后会报错Unexpected identifier 'vec2',我们需要配置一下vite-plugin-glsl。
安装依赖
pnpm i vite-plugin-glsl
编辑vite.config.js文件
import {defin...
yekong
2年前 (2023-03-25)
喜欢
vue数据大屏项目中我们可能需要安装两个不同版本的echarts
安装第一个echarts
pnpm i echarts
安装第二个版本的echarts
因为已经有一个echarts了,所以我们需要给第二个版本起一个别名,我需要安装一个3.8.5版本的echarts,给他定义一...
yekong
2年前 (2023-03-22)
喜欢
axios上传文件的时候,如果文件太大的话,就需要添加一个上传进度了解上传情况,所以我们添加一个进度提示,axios上传进度是通过onUploadProgress来获取的。
html
<el-dialog
title="上传文件到内部存储或SD卡1"...
yekong
2年前 (2023-03-16)
喜欢
vue3 vite项目进行接口调用的时候,会遇到跨域的问题,这时候就需要配置反向代理了。
vite 反向代理说明文档
反向代理说明文档
vite 反向代理配置代码
import {defineConfig} from 'vite';
import vue from '@vitej...
yekong
2年前 (2023-03-15)
喜欢
可视化大屏项目开发中,有一个需求高德地图上要覆盖一个自定义的地图图片,这个要和区域轮廓一致,但是当地图缩放的时候就会导致图片和轮廓不一致,这时候就需要监听地图的zoom了,当地图zoom和默认不一样的时候就隐藏这个图片。
that.map.on('zoomchange', ()...
yekong
2年前 (2023-03-13)
喜欢