Vue

SpringBoot+Vue3实现上传文件功能

目录 前言 一、后端 二、前端 三、演示 前言 开发后台系统时经常遇到实现上传文件的功能,在这记录一下我的方法 后端:SpringBoot2前端:Vue3+ElementPlus工具:IDEA 一、后端 /** * 上传采购合同PDF * * @ »

Vue PC端实现扫码登录功能示例代码

目录 需求描述 思路解析 前端功能实现 如何控制二维码的时效性? 前端如何获取服务器二维码的状态? 本篇文章给大家带来了关于Vue的相关知识,其中主要介绍了在PC端实现扫码的原理是什么?怎么生成二维码图片?怎么用Vue实现前端扫码登录?感兴趣的朋友,下面一起来看一下吧,希望对大家有帮助。 »

Vue3 封装扩展并简化Vuex在组件中的调用问题

目录 1.创建文件utils/vueTool.js 2.添加开发环境中的模块验证 3.页面调用封装 如果你在项目中使用了 vuex模块化,并且在项目中使用actions中函数调用频率高,推荐了解一下这种方式。 比如下面两种方式调用 , 第一个是直接传参设置, 第二个是添加了异步ajax返 »

vue快速入门基础知识教程

目录 1 初识Vue 2 模板语法 3 数据绑定 4 事件处理 5 键盘事件 6 条件渲染 7 列表渲染 v-for指令  8 生命周期 9 总结 VUE是一套前端框架,免除了原生JavaScript中的DOM操作,简化书写。VUE基于MVVM(Model-View_ViewModel)思 »

Vue为何弃用Ajax,选择Axios?ajax与axios的区别?

目录 一、ajax与axios前言 二、ajax与axios的区别 三、Vue中axios的使用 一、发送并发请求 二、全局配置 三、创建axios实例 四、总结 axios是通过Promise实现对ajax技术的一种封装,就像jquery对ajax的封装一样,axios回来的数据是pr »

Vue TypeScript使用eval函数遇到的问题

目录 简单的代码实例问题 解决方法 问题的原理 一劳永逸的方法 正常情况下,项目里不会用eval函数,但是万一要调用一个全局的js库,就需要用eval做些骚操作,这个时候编译会提示:is strongly discouraged as it poses security risks and m »

Vue3异步组件Suspense的使用方法详解

Suspense组件 官网中有提到他是属于实验性功能:<Suspense> 是一项实验性功能。它不一定会最终成为稳定功能,并且在稳定之前相关 API 也可能会发生变化。<Suspense> 是一个内置组件,用来在组件树中协调对异步依赖的处理。它让我们可以在组件树上层等待下层 »

Vue3父子通讯方式及Vue3插槽的使用方法详解

在Vue3中父子通讯方式 Vue3父传子(props) 父组件如下: <template> <div class="about"> <h1>This is an about page</h1> <children »

vue中ref实现子向父传值的示例

目录 前言 一,基础代码 二,层次递进的讲解用法 2.1 给子组件设置ref 2.2 自定义事件 2.3 给子组件设置一个自定义事件 三,灵活性 四,注意 后记 前言 目前我们熟知的子向父传值有两种方式: 一种是在父组件中定义函数,然后将函数利用props传给子组件,子组件调用时 »

vue中ref引用操作DOM元素的实现

目录 前言 一,$refs对象介绍及基本用法 二,使用ref引用组件实例 三,ref的使用案例 3.1 案例需求 3.2 思路与做法 3.2 为什么页面上无法自动获得焦点 3.3 this.$nextTick(cb) 3.4 整体代码 四,总结 前言 在javascript中,我们用 »

vue innerHTML 绑定单击事件不生效的解决

目录 vue innerHTML 绑定单击事件不生效 原代码 最终解决方法 vue动态拼接innerHTML时添加点击事件,并在点击事件中调用vue方法 场景 实现 总结 vue innerHTML 绑定单击事件不生效 在使用 vue时候对 innerHTML进行绑定单击事件,绑定 »

vue安装node-sass和sass-loader报错问题的解决办法

目录 可行版本(针对 node 16+ 版本) 问题描述 解决方法 补充知识:解决启动VUE项目时报node-sass不能运行问题 总结 可行版本(针对 node 16+ 版本) 不想浪费时间看的,可直接去尝试 npm install node-sass@6.0.1 -D npm in »

使用vue-cli创建vue2项目的实战步骤详解

目录 前言 第一步:搭建node运行环境,根据操作系统选择相应安装包 第二步:安装webpack 第四步:创建项目 总结  前言 说明!!!:Vue CLI >= 3 和旧版使用了相同的 vue 命令,所以 Vue CLI 2 (vue-cli) 被覆盖了。所以使用脚手架创建vue2 »

Vue中全局常用的过滤方法解读

目录 1.(将整数部分逢三一断) 2.将数据格式化为金额(2.1有根据正则格式化): 2.1.格式化货币 3.展示时,字数超出10个字的后面省略 4.格式化日期为YYYY-MM-DD 5.格式化日期为YYYY-MM-DD HH:mm:ss 总结 全局引入filter:把写了方法的js文 »

Vue动态类的几种使用方法总结

目录 Vue动态类的几种使用 点击显示或隐藏样式的做法 利用三元表达式切换样式 多个动态类的用法 Vue class动态类名 总结 Vue动态类的几种使用 前言: 动态类的操作比较简单,但是很实用。 点击显示或隐藏样式的做法 利用带数据绑定 <button @cli »

vue集成openlayers问题

目录 vue集成openlayers 下载依赖 创建地图文件 其他API vue openlayers绘制数据时鼠标位置偏移问题 解决方案 总结 vue集成openlayers 下载依赖 cnpm i -S ol 创建地图文件  <div class="map"&gt »

Vue如何引入全局过滤器

目录 Vue引入全局过滤器 创建单独的文件 加上时间过滤函数 在main.js中全局引入 在组件中使用formatDate过滤时间戳 vue全局过滤器配置 总结 Vue引入全局过滤器 创建单独的文件 加上时间过滤函数 将formatDate 暴露export 出来 / »

vue弹窗里面使用echarts不显示的问题及解决

目录 前言 原因分析 解决方式 一、nextTick 二、setInterval 总结 前言 弹出层中插入echarts图表,没有报错,但是图表加载不出来 此弹出层没有用element 的dialog 对话框,用的自己封装的组件,但是出现的问题是一样的 原因分析 弹出层 的内 »

vue $refs动态拼接获取值问题

目录 vue $refs动态拼接获取值 vue $refs不能动态拼接问题 项目需求:动态增减表单并验证 总结 vue $refs动态拼接获取值 div是循环 所以img 的ref是动态设置的 要获取对应点击的  <div class="unionLiveDiv" v-for=" »