80浏览

0评论

Vue实现未登录跳转到登录页的示例代码

1、登录页登录成功时将服务端返回的标识存放起来2、在router中给不需要登录的页面设置 meta : { auth : false }，如首页 3、使用路由前置守卫beforEach，由于给路由设置了meta...

• 2022-12-31

76浏览

0评论

vue跨域proxy代理配置详解

目录引言例一例二总结引言相信很多人都用过proxy，这里就不多说proxy的基本使用，这里要说一下很多人使用proxy的一个误区，大家一般都是直接将管官方的例子拿过来，修改一下代理目...

• 2022-12-31

67浏览

0评论

vue原生input输入框原理剖析

目录正文v-model正文首先我们来看一段代码：<input value="value">这里是一个原生的input输入框，每一个原生的输入框都会有一个value的属性来用于存储用于输入的最新的数据。如...

• 2022-12-31

80浏览

0评论

vue 如何引入本地某个文件 require

目录vue 引入本地某个文件 require1.使用require.context判断某个文件是否存在2.使用 try&hellip;&hellip;catch&hellip;&hellip;vue 引入本地文件无效解决方法vue 引入本地...

• 2022-12-31

76浏览

0评论

Vue 项目性能优化方案分享

目录前言一、代码层面的优化1.1、v-if 和 v-show 区分使用场景1.2、computed 和 watch 区分使用场景1.3、v-for遍历必须为item添加key,且避免同时使用v-if1.4、长列表性能...

• 2022-12-31

60浏览

0评论

Vue子组件内的props对象参数配置方法

目录一、简单数据类型1、布尔类型 Boolean正确写法 ：2、数字类型 Number正确写法 ：3、字符串类型 String正确写法 ：二、复杂数据类型1、数组 Array错误写法 ：Eslint 语法报错 ：正...

• 2022-12-31

65浏览

0评论

关于vue3 vuex4 store的响应式取值问题解决

场景：在页面中点击按钮，数量增加，值是存在store中的，点击事件，值没变。<script setup lang="ts">import { useStore } from '@/vuex';const store = useStore()const onSubmit =...

• 2022-12-31

47浏览

0评论

Vue图片裁剪功能实现代码

目录一、效果展示：1、表单的图片上传项：2、裁剪框页面二、代码部分1、首先安装Vue-Cropper，基于此组件的基础上开发的裁剪页面2、裁剪弹窗的组件编写：3、【图片上传表单项】组件...

• 2022-12-31

41浏览

0评论

Vue 2阅读理解之initRender与callHook组件详解

目录initRender 组件渲染初始化callHook(&#39;beforeCreate&#39;)initRender 组件渲染初始化在 initEvents 事件系统初始化完成之后，紧接着的就是组件实例的渲染部分的初始化...

• 2022-12-31

38浏览

0评论

vue.js动态修改background-image问题

目录vue.js动态修改background-imagevue中background-image问题解决方案小结vue.js动态修改background-image网上搜罗了一圈都没找到vue.js动态修改background-image的相关...

• 2022-12-31

37浏览

0评论

vue弹窗父子组件调用问题示例详解

目录一、vue弹窗 父子组件 emit 传图片二、vue父组件调用子组件里的不同方法一、vue弹窗 父子组件 emit 传图片1、:modal-append-to-body="false"为了解决element ui中引入d...

• 2022-12-31

33浏览

0评论

vue项目打包优化的方法实战记录

目录1.按需加载第三方库2.移除console.log3. Close SourceMap4. Externals && CDN5.路由懒加载的方式总结1.按需加载第三方库例如 ElementUI、lodash 等a, 装包npm install...

• 2022-12-31

31浏览

0评论

Element UI中table单元格合并的解决过程

目录引言解决思路：1、格式化后台返回的数据（根据实际数据格式处理）2、在 data 中定义数据，需要合并几列就定义几个数组和索引3、定义合并函数4、table 组件属性 span-method 的...

• 2022-12-31

48浏览

0评论

Vue3+Vite实现动态路由的详细实例代码

项目基本目录1.首先定义初始默认的路由routes(router.js文件),vue文件使用import引入可以按需加载import { createRouter, createWebHashHistory} from "vue-router";...

• 2022-12-31

50浏览

0评论

vue长列表优化之虚拟列表实现过程详解

目录前言实现原理实现代码总结 前言应用场景:后台一次性发送上千条或更多数据给前台场景模拟:用户发起一个请求,后台发送了10w条数据使用虚拟列表之前:前台需要生成10w个dom...

• 2022-12-31

61浏览

0评论

vue项目依赖升级报错处理方式

目录vue项目依赖升级报错处理当启动vue项目安装依赖时报错vue项目依赖升级报错处理1.Vue Router 升级到3.5.1报错：Navigation cancelled from "/login" to "/" with a new na...

• 2022-12-31

39浏览

0评论

Vue cli及Vue router实例详解

目录前言:1. 安装1.1 npm安装1.2 vue-cli安装2. 初始化项目2.1vue init命令讲解2.2 项目初始化3. 运行项目4. 成功页面5. 项目结构5.1 总体框架5.2 配置目录文件详解5.3src...

• 2022-12-31

332浏览

0评论

vue中的inject用法及说明

目录vue inject用法作用：刷新vue组件使用prvide inject的超级的一个大坑解决的办法vue inject用法作用：刷新vue组件使用方法：在APP.vue中 provide(){            return...

• 2022-12-31

59浏览

0评论

Vue Router解决多路由复用同一组件页面不刷新问题(场景分析)

目录简介问题复现代码测试解决方案方案1：导航守卫方案2：watch监听$route方案3：父组件router-view指定key其他网址简介说明本文介绍如何解决Vue的多路由复用同一组件页面不刷新...

• 2022-12-31

270浏览

0评论

vue中img或元素背景图片无法显示或路径错误的解决

目录img或元素背景图片无法显示或路径错误背景图片打包后出现的路径引用错误问题img或元素背景图片无法显示或路径错误1.在给vue中img元素动态绑定图片路径时会显示不出来图...

• 2022-12-31

47浏览

0评论

vue子组件通过.sync修饰符修改props属性方式

目录子组件通过.sync修饰符修改props属性子组件修改父组件prop的几种方式常用方式取巧方式子组件通过.sync修饰符修改props属性在vue子组件中，如果我们直接修改props中的属性...

• 2022-12-31

58浏览

0评论

Vue3+Element Plus使用svg加载iconfont的处理方法

目录安装依赖将iconfont封装成svg如何使用设置”hover“样式为什么图标颜色无法修改？总结安装依赖由于我们是Vue3项目，可以使用vite来快速创建一个Vu3项目：npm insta...

• 2022-12-31

35浏览

0评论

Vue 实现新国标红绿灯效果实例详解

目录引言1 组件分析1.1 lamp1.2 lamp-group1.3 traffic-lamp2 全局文件定义2.1 样式变量2.2 常量定义2.3 导入资源3 组件开发3.1 实现 lamp 组件3.2 实现 lamp-group 组件3....

• 2022-12-31

31浏览

0评论

vue3:setup语法糖使用教程

目录1.setup语法糖简介2.setup语法糖中新增的api2.1defineProps2.2defineEmits2.3defineExpose补充：与普通的script一起使用总结1.setup语法糖简介直接在script标签中添加set...

• 2022-12-31

46浏览

0评论

Vue 2源码阅读 Provide Inject 依赖注入详解

目录Provide/Inject 初始化1. initInjections 依赖初始化2. initProvide 注入数据初始化总结Provide/Inject 初始化1. initInjections 依赖初始化该步骤其实发生在 initStat...

• 2022-12-31

398浏览

0评论

vue-i18n的9以上版本中@被用作特殊字符处理,直接用会报错问题

目录vue-i18n的9以上版本中@被用作特殊字符处理解决方法vue@2.6.14安装vue-i18n报错peer vue@“^3.0.0“ from vue-i18n@9.1.9vue-i18n的9以上版本中@被用作特殊...

• 2022-12-31

55浏览

0评论

vue安装less-loader依赖失败问题及解决方案

目录vue安装less-loader依赖失败安装less-loader报错 unable to resolve dependency tree降低 less-loader 版本vue安装less-loader依赖失败vue可视化面板中提供的less-load...

• 2022-12-31

46浏览

0评论

详解vue route介绍、基本使用、嵌套路由

目录前言一、介绍、安装1.定义2.安装二、基本使用（代码后赋）三、嵌套路由1.布局逻辑2.效果展示3.代码四、注意前言想要学习完整内容请关注主页的专栏———&md...

• 2022-12-31

48浏览

0评论

vue3项目新用户引导组件driver.js示例详解

好用的用户引导插件有 intro.js 和 driver.js 两个，对比了一下，最终还是使用了driver.js
主要有以下原因：用法简单可以商用总要选一个吧项目使用的是vue3+ts
因为多个地方需要...

• 2022-12-31

31浏览

0评论

Vue使用provide各种传值后inject获取undefined的问题及解决

目录使用provide各种传值后inject获取undefined不如直接让爷爷组件传thisinject接收不到provide中的值一、question？？？二、Why三、Answer使用provide各种传值后inject获取undef...

• 2022-12-31

45浏览

0评论

vue.js引用背景图background无效的3种解决方案

目录效果图预览1. 正确的代码，示例如下2. 错误的代码，截图对比vue添加背景图没反应＃vue.js项目中，出现css调用background背景图无效？如何解决？或者调用<img>标签，也无效果？直接上代...

• 2022-12-31

43浏览

0评论

详解Vue 2中的  initState 状态初始化

目录initState 状态初始化1. initProps2. initSetup3. initMethods4. initData5. initComputed 与 initWatchinitState 状态初始化在配置标准化合并以及声明周期初始化完成...

• 2022-12-31

56浏览

0评论

一文秒懂vue-property-decorator

目录我们来看下页面上代码展示:1.@Component(options:ComponentOptions = {})2.@Prop(options: (PropOptions | Constructor[] | Constructor) = {})3，@PropSync(propName: s...

• 2022-12-31

37浏览

0评论

vue 3.0 使用ref获取dom元素的示例

前言附上vue3.0文档：Vue3中文文档 - vuejsVue 2.x获取DOM<div ref="myRef"></div>this.$refs.myRefVue 3.0获取单个DOM<template> <div ref="myRef">获取单个DOM元素</div><...

• 2022-12-31

39浏览

0评论

Vue中transition标签的基本使用教程

目录transition 标签配合 animation配合 transitiontransition-group 标签动画库 animate.css总结transition 标签transition 标签：Vue 的内置动画标签作用：在 [插入] / [更新...

• 2022-12-31

38浏览

0评论

vue项目中安装less依赖的过程

目录vue安装less依赖一、安装less依赖二、修改webpack.base.conf.js文件vue中less知识点总结安装变量（Variables）混合（Mixins）嵌套（Nesting）运算（Operations）转义（Escaping）函数（Functi...

• 2022-12-31

187浏览

0评论

vue+vux vux安装出现错误问题及解决

目录搭建vux项目首先搭建vue项目安装vux最后启动项目 npm run dev || cnpm run devvux安装中遇到的坑搭建vux项目介绍：VUX是基于WeUI和Vue(2.x)开发的移动端UI组件库,基于web...

• 2022-12-31

53浏览

0评论

手写实现vue2下拉菜单dropdown组件实例

目录概述最终效果（动图没显示出来，请稍定会儿，可以先看后面）实现原理具体实现目录结构emitter.jsMyDropdown.vueMyDropdownMenu.vueMyDropdownItem.vue总结概述一般后台项目结合...

• 2022-12-31

34浏览

0评论

一款移动优先的Solid.js路由solid router stack使用详解

目录...

• 2022-12-31

50浏览

0评论

vue项目中页面底部出现白边及空白区域错误的问题

目录vue页面底部出现白边及空白区域错误问题页面底部出现白边底部出现空白区域vue页面四周有白边的问题vue页面底部出现白边及空白区域错误问题页面底部出现白边类似于这种...

• 2022-12-31

48浏览

0评论

vue中实现拖拽排序功能的详细教程

目录原生拖拽 API 实现拖拽设置元素 dragable拖放事件拖拽排序拖拽API + 防抖实现vue awe-dnd 拖拽组件安装 awe-dnd 组件库在 main.js 中将 awe 挂载到全局实现案例项目中-...

• 2022-12-31

42浏览

0评论

vue中$emit的用法详解

目录vue2.xvue3.x子组件父组件vue2.x1、父组件可以使用 props 把数据传给子组件。
2、子组件可以使用 $emit,让父组件监听到自定义事件 。vm.$emit( event, arg ) //触发当...

• 2022-12-31

52浏览

0评论

Vue.Draggable使用文档超详细总结

目录前言特性安装引入基础用法属性options配置项事件插槽HeaderFooter总结前言Draggable为基于Sortable.js的vue组件，用以实现拖拽功能。关于Vue.Draggable详细信息可以查看g...

• 2022-12-31

48浏览

0评论

关于vite.config.ts文件的配置方式

目录vite.config.ts文件的配置1、alias配置别名2、关于path的引入vite项目在jenkins自动打包报错2种解决方案vite.config.ts文件的配置import { defineConfig } from 'vite'...

• 2022-12-31

46浏览

0评论

Vue keepAlive实现不同的路由共用一个组件component的缓存问题(推荐)

不同的路由共用一个组件component，并用keepAlive实现不同的页面缓存实现功能：使用列表页面检索的数据跳转到对应的详情页面，从详情页回到列表页能记住上次检索的数据，再次切换到...

• 2022-12-31

31浏览

0评论

Vue3响应式对象是如何实现的(1)

目录简单的响应式实现Proxy与响应式为什么需要Proxy？Proxy创建的代理对象与原始对象有何不同？多副作用函数的响应式实现简单的响应式实现为了方便说明，先来看一个简单的例子。c...

• 2022-12-31

59浏览

0评论

vue+echars封装气泡图的方法

本文实例为大家分享了vue+echars封装气泡图的具体代码，供大家参考，具体内容如下前端可视化封装气泡图1. html<template>  <div class="bubble-chart">    <div ref="bubble...

• 2022-12-31

341浏览

0评论

Vue前端框架搭建过程

目录一、安装 NodeJS二、安装 vue-cli三、创建项目一、安装 NodeJS见 Windows下安装NodeJS。二、安装 vue-cli1.vue-cli 2.x 升级到 3.x（1）卸载 2.x 版本npm uninstall -g vue...

• 2022-12-31

47浏览

0评论

vue3.0实现移动端电子签名组件

本文实例为大家分享了vue3.0实现移动端电子签名组件的具体代码，供大家参考，具体内容如下因业务需求，前段时间写了一个电子签名组件，在这里记录一下，绘图需求，首先肯定需要使用canv...

• 2022-12-31

57浏览

0评论

关于Element table组件滚动条不显示的踩坑记录

目录踩坑详情在多table切换的单个页面内处理办法踩坑详情在多table切换的单个页面内1、某些table的横向滚动条不自动显示，在手动调整窗体大小或者进行缩放操作时会恢复正常。...

• 2022-12-31