Vue - 随笔分类 - Mahmud*小麦*

摘要：

后端接口返回的是一个word转64的文档数据，前端需要页面中正确的解析导出文档预览： 1，导出功能的实现修改exportReport接口调用，设置responseType为blob以接收二进制数据修改openExport方法，实现Word文档的自动下载功能添加下载工具函数，处理blob数据转换阅读全文

posted @ 2025-10-14 11:46 Mahmud*小麦* 阅读(116) 评论(0) 推荐(0)

🎈vue3的组件通信和使用场景🌴✔️🍒

摘要：

Vue3 提供了多种组件通信方式，适用于不同的场景。以下是主要的通信方法及其实现方式： 1. Props / Emits (父子组件通信) 使用场景：父子组件之间的直接通信，最基础的方式。  <template> <ChildComponent :title="parentT 阅读全文

posted @ 2025-10-13 10:50 Mahmud*小麦* 阅读(37) 评论(0) 推荐(0)

Vue大屏可视化自适应（等比列缩放）方案✔️✔️✔️✨

摘要：

在vue大屏可视化项目中，自适应是确保在不同尺寸屏幕上正常显示的关键需求。下面我将详细介绍我在项目开发中常用的方案：Scale方案的实现✔️✔️ 1，常用自适应方案 CSS媒体查询 - 针对不同屏幕尺寸编写不同样式 Flex/Grid布局 - 使用弹性布局适应不同尺寸 Rem/VW单位 - 使用相对阅读全文

posted @ 2025-10-11 10:15 Mahmud*小麦* 阅读(204) 评论(0) 推荐(0)

【持久化存储】VUE2 vuex-persistedstate插件♾️VUE3 pinia的持久化存储pinia-plugin-persistedstate的使用♨️✔️💯

摘要：

解决Vue项目页面刷新数据丢失的🎈🎈🎈 vuex存储的数据只是在页面中，相当于全局变量，页面刷新时vuex里的数据会重新初始化，导致数据丢失vuex里的数据是保存在运行内存中的，当页面刷新时，页面会重新加载vue实例，vuex里面的数据会被重新赋值这句话对吧 ~~~ ~~~~ 🏀怎么解决呢阅读全文

posted @ 2025-06-24 11:06 Mahmud*小麦* 阅读(441) 评论(0) 推荐(0)

🪶vue-element-admin上传图片的功能📂🖼️

摘要：

🪶🪶🪶在vue后台管理系统里面，有时候会遇到一个图片上传的功能，做这个功能的时候的思路是这样的：1：首选由前端写一个图片上传的upload标签，选择本地的图片文件之后2:调用后端给的接口，以二进制文件的形式传给后端服务器3:服务器进行处理，处理完成之后将服务器的主机名加到图片名称的前缀上4:返阅读全文

posted @ 2025-05-27 16:38 Mahmud*小麦* 阅读(53) 评论(0) 推荐(0)

简单的了解一哈 Vue3和Vue2的响应式原理🪶？【vue3：proxy | vue2：Object.defineProperty()】🎈🎈🎈

摘要：

vue的新项目开发者经常遇到响应式问题，那么vue2和vue3的响应式原理实现流程和主要的区别是如何~~~ vue3 ——— proxy ♦️ vue2 ———— Object.defineProperty() ？ 1. vue2.x的响应式原理实现原理：通过Object.definePrope 阅读全文

posted @ 2025-04-27 16:40 Mahmud*小麦* 阅读(47) 评论(0) 推荐(0)

vue项目中Echarts中的水位图（水波图、水球图、水半球）实现的详细步骤🥏🧿✓✓✓（echarts-liquidfill插件的使用~✓）

摘要：

Vue结合echarts实现水滴图🥏🧿✓✓✓（echarts-liquidfill插件的使用~✓） 1，单水滴图表~动态展示 1，安装echarts-liquidfill npm install echarts-liquidfill 2，代码实现~ <template> <div id="cpu 阅读全文

posted @ 2025-04-02 11:38 Mahmud*小麦* 阅读(1730) 评论(0) 推荐(0)

Vue3的笔记✓~🪶🐸📍

摘要：

1，认识VUE3 1，vue3特点： 2020 年底vue.js团队发布了3版本。耗时2年多开发完毕。由尤雨溪团队打造。 1、性能提升打包大小减少41% 初次渲染快51%，更新渲染快133% 内存占用减少54% 2、源码升级使用Proxy 代替Object.defineProperty 实现阅读全文

posted @ 2025-03-19 11:01 Mahmud*小麦* 阅读(66) 评论(0) 推荐(0)

🪢Nginx前端部署测试🥓🎈【本地部署测试+线上部署】

摘要：

🪢Nginx前端本地部署测试前端开发中虽然把本地的前端包部署到线上服务器，部署，测试...等都属于运维的工作范围内，但是作为一个前端开发者需要学会这些步骤的😬⚛：今天我就带大家先来个小实验，我们今天就尝试着进行本本地的nginx简单部署，等到后期，我们用购买的服务器进行线上的测试~~ 下载n 阅读全文

posted @ 2025-02-11 11:20 Mahmud*小麦* 阅读(179) 评论(0) 推荐(0)

【大屏可视化】系统（Vue3 + ECharts5）快速实现和应用 🎶🎈🗓️

摘要：

🎶【大屏可视化】系统（Vue3 + ECharts5）🎶 这八部~~按照，难易的顺序来进行绘制！！！💯 横向柱形图竖向柱形图雷达图环形图关系图数据云图数据展示图地图可视化 02：基于 vite 与 tailwindcss 创建大屏可视化项目 1，基于 vite 创建项目，使用：阅读全文

posted @ 2025-01-20 17:30 Mahmud*小麦* 阅读(3987) 评论(0) 推荐(1)

vue项目中API接口的管理和axios的使用详解（附登录小案例）🚩✔✔✔

摘要：

在项目中，和后台交互数据这块，有三个流行的库。 jQuery ajax $.ajax({ type: 'POST', url: url, data: data, dataType: dataType, success: function () {}, error: function () {} }) 阅读全文

posted @ 2024-07-23 16:12 Mahmud*小麦* 阅读(192) 评论(0) 推荐(0)

数据展示动态（跑分）显示

摘要：

1.页面显示（强烈推荐） <template #header> <avue-data-tabs :option="dataOptions" :data="tabData" style="width: 75%;"></avue-data-tabs> </template> 2.具体代码阿和方法实现 2 阅读全文

posted @ 2024-05-28 17:06 Mahmud*小麦* 阅读(19) 评论(0) 推荐(0)

日期选择器：年月日动态切换显示

摘要：

1. 组件样式部分（elementUI）实现 <el-row> <el-col :span="10"> <el-button-group> <el-button :class="{ 'is-active': selectedButton 'year' }" @click="changeToYearP 阅读全文

posted @ 2024-05-28 16:50 Mahmud*小麦* 阅读(304) 评论(0) 推荐(0)

Ement-Plus框架的列表table导出excel数据表

摘要：

1.页面预览 2.搜索条件区域 code  <div class="table-container"> <el-form :inline="true" :model="queryForm" class="query-form" ref="queryFormRef"> <el-f 阅读全文

posted @ 2024-05-20 16:13 Mahmud*小麦* 阅读(80) 评论(0) 推荐(0)

Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法~

摘要：

前几天在vue运行项目过程中报错了,这个方法是关于Vue报错Syntax Error:TypeError: this.getOptions is not a function的解决方法（1）报错一（2）报错二~ 1.1问题分析首先，检查代码，并没有什么错误的地方；其次，涉及到这个问题，可能就阅读全文

posted @ 2023-10-12 17:14 Mahmud*小麦* 阅读(2191) 评论(0) 推荐(0)

用户登录🔒~生成图片验证码（identify(生成图片验证码)插件）

摘要：

1.效果图: 2.以用户登录实现生成图片验证功能：使用 identify(生成图片验证码)插件 identify：这是一个vue的插件，使用canvas来生成图形验证码 2.1 下载identify插件，npm安装 npm i identify 2.2 具体参数如下： 2.2 在component 阅读全文

posted @ 2023-09-23 19:34 Mahmud*小麦* 阅读(433) 评论(0) 推荐(0)

js简单的倒计时器~~⏰

摘要：

1.效果图 2.html部分 3.逻辑部分 3.1获取当前时间，时间差 //获取当前时间 var date = new Date(); var now = date.getTime(); //设置截止时间 var str = "2023/9/14 12:28:34"; var endDate = n 阅读全文

posted @ 2023-09-14 12:40 Mahmud*小麦* 阅读(76) 评论(0) 推荐(0)

localstorage本地存储token，vuex刷新数据丢失问题⚡⚡⚡

摘要：

1.vuex和axios安装，引入，使用 1.1vuexa安装和使用 vuex3.x版本的官网安装教程:安装 | Vuex vuex4.x版本的官网安装教程:安装 | Vuex npm install vuex --save 2.在src下新建文件夹store,并在文件夹中新建文件index.js, 阅读全文

posted @ 2023-08-25 08:53 Mahmud*小麦* 阅读(967) 评论(0) 推荐(0)

el-table设置单元格里的字体颜色

摘要：

例如图中，设置某个单元格的字体颜色： ① el-table标签上添加属性：:cell-style=“cellStyle” <el-table :data="tableData" :cell-style="cellStyle" border stripe fit> ②vue文件里在method里声明阅读全文

posted @ 2022-12-14 12:40 Mahmud*小麦* 阅读(1404) 评论(0) 推荐(0)

更新代码出现冲突：incoming change和current change

摘要：incoming change和current change incoming change和current change 1.提交代码时冲突。如果远端代码和本地修改有冲突，是不会拉取代码成功的，也就是说，只有把代码贮藏【stash】起来，才能拉取到最新代码，这时候应用贮藏的时候就可能会发生冲突阅读全文

posted @ 2022-12-05 10:35 Mahmud*小麦* 阅读(861) 评论(0) 推荐(0)

Mahmud

随笔分类 - Vue

公告