Vue首屏白屏问题的原因和解决方法讲解
目录一.路由模式错误(路由重复或者没有配置路由)二.dist中文件引用路径错误(vue项目打包的路径问题)三.浏览器不支持es6四.加载文件资源过大vue首屏白屏原因大概有以下几点：...
2023-05-17
Vue3 Watch踩坑实战之watch监听无效
目录ref 与 reactivewatch总结ref 与 reactiveref函数和reactive函数都是用来定义响应式数据但是reactive更适合定义引用类型、ref适合定义基本数据类型（可接收基本数据类型...
2023-05-17
vue执行配置选项npm run serve的本质图文详解
目录一、启动开发服务器、调用“工具链”、编译、并运行当前工程二、npm run serve内部原理分析三、vue编译运行过程总结一、启动开发服务器、调用“工具链&...
2023-05-17
详解Vue如何实现字母验证码
目录1. 确定需求2. 设计组件结构3. 实现功能3.1 生成随机字母验证码3.2 刷新验证码3.3 提交验证码4. 效果演示5. 总结1. 确定需求在实现字母验证码之前，我们需要明确需求并准...
2023-05-17
el-form-renderer使用教程
目录前言起步 使用update-form && getFormValue表单项动态显示或隐藏(hidden)表单数据联动(on)输入/输出格式化(inputFormat/outputFormat)set-optionsel-form-renderer 实...
2023-05-17
深入探讨Vue 3中的组合式函数编程方式
目录什么是组合式函数鼠标跟踪器示例异步状态示例约定和最佳实践 命名输入参数返回值副作用使用限制通过抽取组合式函数改善代码结构选项式API中使用组合...
2023-05-17
Vue中的组件注册方法及注意事项
目录Vue组件的基本概念Vue组件的注册全局注册局部注册如何使用Vue组件组件之间嵌套Vue组件的基本概念Vue组件是一种可复用的Vue实例，用于封装可重用的HTML元素、JavaScript代...
2023-05-17
element-ui中el-cascader动态加载和默认值详解
刚解决了这个问题，趁热赶快拿出来凉凉，明天早上起来估计会忘下拉框的选择和默认值对于我来说一直都是个让人头疼的事，倒不是有多么难，而是很繁琐。要保证有值，还要有显示的文字。...
2023-05-17
element-ui中表格设置正确的排序及设置默认排序
本文主要解决两个问题，第一个，在element-ui中，直接设置参数排序，达不到预期效果，预期是按照数字的大小进行排序；第二个，想对表格中某个字段设置默认的排序方式现象：
直接设置在 el-t...
2023-05-17
教你使用vue-autofit 一行代码搞定自适应可视化大屏
目录可视化大屏适配/自适应现状三大常用方式解决留白问题常用分辨率计算补齐白边所需的px最终效果亲手打造集成工具：vue-autofit可视化大屏适配/自适应现状可视化大屏的适配...
2023-05-17
VueRouter 原理解读之初始化流程
目录1.1 核心概念官方介绍使用与阅读源码的必要性1.2 基本使用路由配置与项目引入路由组件使用跳转 api 调用2.1 createRouter 初始化入口分析大致流程Router 对象的定义：创...
2023-05-17
深入了解Vue3中props的原理与使用
目录前言介绍原理前提创建组件实例对象初始化Props操作创建proxy对象去获取Propsprops作为参数传入setup将proxy挂载到render上总结前言props指父组件往子组件中传入参数，我...
2023-05-17
VUE项目启动没有问题但代码中script标签有蓝色波浪线标注
目录项目场景：问题描述原因分析：解决方案：总结项目场景：VUE 中项目启动没有问题，代码中 script 标签有蓝色波浪线标注：并且有相关的 提示信息Virtual script not found, may missi...
2023-05-17
Vue3中watch无法监听的解决办法
下面的代码在对ref实例赋值完之后。既：test.value = { name: 1 }，会发现不执行watch里面的回调函数了，这是为什么呢？<!DOCTYPE html><html lang="en"><head> <meta charset="UT...
2023-05-17
vue3响应式对象的api超全实例详解
目录Ⅰ. ref、reactive ( 递归监听 )Ⅱ. isRef、isReactive ( 判断 )Ⅲ. toRef 和 toRefs ( 解构 )Ⅳ. toRaw 、 markRaw ( 解除代理)Ⅴ. unref ( 拷贝 )Ⅵ. shallowRef 、s...
2023-05-17
Vue使用vm.$set()解决对象新增属性不能响应的问题
在Vue.js中，当你向一个已经创建的对象添加新属性时，Vue无法检测到该变化并自动更新视图。这是因为Vue在初始化时对数据进行了响应式转换，只有在这个过程中存在的属性才...
2023-05-17
如何使用VUE+faceApi.js实现摄像头拍摄人脸识别
目录需求：实现步骤：第一步：下载引入必要包下载依赖下载model将项目中的model放入VUE中的public文件加下第二步：先把HTML写上去 第三步 可以开始代码了首先引入下载好的face-api....
2023-05-17
一文详解Vue-组件自定义事件(绑定和解绑)
目录组件自定义事件(绑定)1 编写案例2 props实现3 自定义事件实现方式14 自定义事件实现方式25 只能触发一次事件6 多个参数传递组件自定义事件(解绑)1 解绑一个事件2 解绑...
2023-05-17
Vue组件设计之多列表拖拽交换排序功能实现
目录1. 安装所需依赖2. 组件设计实现3. 组件使用示例在前端开发中，拖拽排序是一种提升用户体验非常好的方式，常见的场景有单列表拖拽排序，多列表拖拽交换排序，比如以下这种效果：...
2023-05-17
vue3+ts实现树形组件(菜单组件)
目录前言全局注册组件组件的实现树形组件的基本结构：完善组件(添加点击事件，过渡效果)✌️✌️添加过渡总结：前言之前在使用element-plus的使用，使用el-menu组件，并且使用了递归思想...
2023-05-17
深入解析Vue的自定义指令
目录介绍指令钩子钩子参数简化形式对象字面量在组件上使用介绍除了 Vue 内置的一系列指令 (比如 v-model 或 v-show) 之外，Vue 还允许你注册自定义的指令 (Cus...
2023-05-17
浅谈一下Vue技术栈之生命周期
目录1、什么是生命周期2、分析生命周期2.1 生命周期钩子函数2.2 生命周期钩子函数的作用2.3 生命周期钩子函数图例2.4 生命周期钩子函数的应用3、生命周期总结1、什么是生命...
2023-05-17
vue3+Typescript实现路由标签页和面包屑功能
目录在vue中实现路由标签页和面包屑需求分析最终效果实现步骤第一步：创建路由标签组件和面包屑第二步：创建路由标签数组第三步：监听路由变化并自动添加新标签第四步：处理关闭标...
2023-05-17
详解Vue中双向绑定原理及简单实现
目录监听器订阅器双向绑定构造函数编译器（1）Compile类（2）node2Fragment函数（3）compile函数总结效果完整代码代码缺陷监听器vue实现双向绑定时，首先要实现目标data的监听（通过 Object...
2023-05-17
Vue中computed属性和watch,methods的区别
目录computedwatchmethods归纳三者不同点1、methods2、computed3、watch在Vue中，computed、watch和methods是处理响应式数据的三种方式。它们的主要区别在于计算方式、响应方...
2023-05-17
vue2+springsecurity权限系统的实现
目录准备内容JWT 校验用户的凭证（头部，载荷，签证）SpringSecurity 权限控制配置 SpringSecurity准备内容新建项目，SpringBoot采用2.7.11，spring-boot-starter-security，vue 2.0默认...
2023-05-17
Vue3通用API功能示例剖析
目录通用APIversion （暴漏当前使用的Vue版本）nextTick （Dom更新完成后触发，用于获取更新后的Dom）defineComponent（类型推导的辅助函数, 让 TypeScript 正确地推导出组件选项内的类...
2023-05-17
Webpack和Vite的区别小结
目录前言WebpackViteVite相比于Webpack打包更快相比Webpack5中使用的MFSU技术Vite插件推荐总结前言Webpack和Vite是现代前端开发中非常重要的工具，有助于改善开发者的工作流...
2023-05-17
Vue跨端渲染实现多端无缝衔接
Vue 内部的组件是以虚拟 dom 形式存在的。下面的代码就是一个很常见的虚拟 Dom，用对象的方式去描述一个项目。相比 dom 标签相比，这种形式可以让整个 Vue 项目脱离浏览器的限...
2023-05-17
vue使用moment如何将时间戳转为标准日期时间格式
目录使用moment将时间戳转为标准日期时间格式将时间戳转换为日期格式：moment、new Date（）1.new Date()方式2. moment函数方式3.配合过滤器fliter使用总结使用moment将时间戳转...
2023-05-17
React之input动态取值和赋值方式
目录react input动态取值和赋值react获取input框的值总结react input动态取值和赋值需求：对用户在form表单输入的值提取出来,并且改变setState中的数据1.在constructor中设置...
2023-05-17
VUEX如何使用
目录1. vuex简介2. vuex的组成结构示意图3. vuex 的核心概念3.1 store3.1.1 创建store3.1.2 一个完整的store的结构是这样的3.2 state3.2.1 如何在组件中获取vuex状态3.2.2...
2023-05-17
Vue3中axios请求封装、请求拦截与相应拦截详解
目录前言axios请求封装请求拦截和响应拦截接口的请求总结前言对于三者放在Service.js中封装，方便使用axios.create 的作用是创建一个新的 axios 实例，该实例可以具有自定义配...
2023-05-17
2023年最新的vue.js下载和安装的3种方法详解
目录1. 文章引言2. 环境搭建3. 安装vue.js3.1 方法一：官网下载vue.js源代码3.2 方法二：使用npm install创建3.3 方法三：使用bower下载4. 总结1. 文章引言我主要从事java后端开...
2023-05-17
Vue项目本地没有问题但部署到服务器上提示错误(问题解决方案)
一个 VUE 的项目在本地部署没有问题，但是部署到服务器上的时候提示访问资源的错误。问题和解决经过看看代码后才了解到，VUE 可以有几个配置文件。分别是： .env 和 .env.product...
2023-05-17
vue3使用flv.js播放推流视频的示例代码
目录前言1、构建2、销毁3、断流、卡顿重连4、报错、停滞重连5、累计延时处理6、手动全屏前言本人是在vue3中使用flv.js处理推流时，遇到的一些问题，以及处理办法，归纳总结为一个...
2023-05-17
Vue自定义指令深入探讨实现
目录指令自定义指令关于注册自定义指令全局注册局部注册自定义指令的钩子函数封装自定义指令指令想要了解自定义指令，那肯定得先明白什么是指令。指令的本质：语法糖，标志位。在...
2023-05-17
深入理解Vue响应式原理及其实现方式
目录Vue的响应式Vue2的响应式原理Vue3的响应式原理深入理解响应式1.数据初始化2.对象的数据劫持Vue的响应式用过Vue这个框架的人应该都知道，数据驱动是Vue框架的核心，数据双向...
2023-05-17
vue中标签自定义属性的使用及说明
目录vue标签自定义属性使用举个例子vue自定义属性的设置及获取vue中设置自定义属性及获取总结vue标签自定义属性使用在 vue 中，尽量避免对dom的操作，通过对状态的管理实现需要...
2023-05-17
vue中radio单选框如何实现取消选中状态问题
目录vue radio单选框如何取消选中状态客户需求如何获取radio的选中值 、选中状态方法1方法2总结vue radio单选框如何取消选中状态客户需求单选radio选中后，再次点击需要可以...
2023-05-17
前端Vue项目部署到服务器的全过程以及踩坑记录
目录需求过程1、首先，肯定需要将vue的项目进行打包2、将dist文件上传到服务器3、使用Nginx配置 踩坑nginx服务器404错误的原因 404 Not Foundnginx服务器500错误的原因 500...
2023-05-17
vue3 证件识别上传组件封装功能
证件图片识别上传根据业务需要，经常涉及到证件上传，例如身份证上传、银行卡、营业执照等信息，根据设计师的设计，单独封装了一个上传组件。识别接口后端用的是阿里云的。
上传组...
2023-05-17
Vue3项目引入阿里iconfont图标与字体及使用教程
目录需求：1.常用图标格式简介1.1 unicode 格式1.2 font-class 方式1.3 symbol 方式2.项目引入 iconfont2.1 封装 svg-icon 组件2.2 引入 iconfont3.项目中具体使用 iconfont4...
2023-05-17
本地部署element-plus文档的简单步骤
目录前言1. 安装tomcat9.0或者其他版本均可2.下载element-plus文档3, 解压到tomcat的安装目录webapps下4，配置访问路径5，访问总结前言由于一直使用的前端组件element-plus，所以...
2023-05-17
Vue3父子组件间传参通信的四种方式
目录前言一、父传子 defineProps二、子传父 defineEmits三、子组件暴露属性给父组件 defineExpose四、依赖注入Provide / Inject参考总结前言本文主要是记录Vue3在setup语法...
2023-05-17
vue中table实现真正的跨越全选
目录一、项目需求二、代码实现三、代码实现全选按钮的半选状态四、总结一、项目需求1.最初产生运营测试时，提出跨页全选的要求；感官上在页面中只要勾选上方的复选框，那么就要勾...
2023-05-17
VUE v-bind 数据绑定的示例详解
动态的绑定一个或多个 attribute，也可以是组件的 prop。缩写： : 或者 . (当使用 .prop 修饰符)期望： any (带参数) | Object (不带参数)参数： attrOrProp (可选的)修饰符：.camel...
2023-05-17
在Vue3项目中使用如何echarts问题
目录一，创建 Vue3 项目并安装 echarts二，创建数据可视化组件（一）组件内容（二）使用组件（三）程序解释三，响应式刷新更多功能可扩展总结记得第一次使用 echarts 还是2019年的时候，那时做...
2023-05-17
Vue中data数据初始化方法详解
目录初始化化数据的一些方法以下是一个简单的例子父组件子组件显示效果销毁数据的父组件子组件显示效果当组件的根元素使用了v-if的时候, 并不会初始化data中的数据 如果想...
2023-05-17
