106浏览

0评论

elementui中树形表格切换展开不同层级的示例代码

效果： 代码（复制粘贴即可）：<template> <div class="myDiv"> <el-row style="margin:10px 0"> <el-col :span="22"> <el-button type="pri...

• 2022-12-31

194浏览

0评论

vue源码解读子节点优化更新

目录前言优化前存在的问题优化策略分析源码解析小结前言Vue中更新节点，当新 VNode 和旧 VNode 都是元素节点且都有子节点时，Vue会循环对比新旧 VNode 的子节点数组，然后根据不...

• 2022-12-31

114浏览

0评论

一文详解Vue的响应式原则与双向数据绑定

目录反应性原则双向数据绑定v-model实践反应性原则它是 Vue.js 的核心特性之一，一个数据驱动的视图，我们修改数据视图来响应更新，非常优雅。Vue2.x 使用 Object.defineProperty...

• 2022-12-31

119浏览

0评论

element el-tree折叠收缩的实现示例

原理：通过el-tree 的 elTree.store.nodesMap获取所有树节点，设置所有节点的 expanded 属性，使用该方法时特别注意el-tree必须设置node-key="id",作为每个树节点唯一标志，否则使...

• 2022-12-31

102浏览

0评论

vue日常开发基础Axios网络库封装

目录引言axios使用配置请求基本信息设置请求拦截器设置请求响应器项目中使用结尾引言首先Axios，一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。网络请求库无疑是...

• 2022-12-31

113浏览

0评论

vue3 使用setup语法糖实现分类管理功能

目录setup语法糖简介setup语法糖中新增的api模块简介分类模块路由分类列表组件获取分类列表数据分类表单组件setup语法糖简介直接在 script 标签中添加 setup 属性就可以直...

• 2022-12-31

107浏览

0评论

vue和react中关于插槽详解

目录简述Slot基本插槽vue基本插槽react基本插槽具名插槽vue具名插槽react具名插槽的讨论模仿具名插槽属性插槽插槽传参vue插槽传参react：render-props简述Slotslot插槽是Vue...

• 2022-12-31

126浏览

0评论

Vue3 源码解读静态提升详解

目录什么是静态提升transform 转换器hoistStatic 静态提升walk 函数walk 函数流程图总结什么是静态提升静态提升是Vue3编译优化中的其中一个优化点。所谓的静态提升，就是指在...

• 2022-12-31

125浏览

0评论

Vue3中使用pnpm搭建monorepo开发环境

目录前言Pnpm 和 Monorepo搭建开发环境创建项目配置 monorepo安装依赖初始化Typescript准备两个模块sharedreactivity编写构建脚本完成第一次调试小结前言Vue3 源码阅读系列...

• 2022-12-31

111浏览

0评论

教你在vue 中使用 svg symbols

目录安装svg-sprite-loader插件在vue.config.js中配置 svg-sprite-loader封装IconSvg.vue通用组件加载所有的svg静态资源，并且把IconSvg注册到全局组件当中使用安装svg-sprit...

• 2022-12-31

93浏览

0评论

vue2中组件互相调用实例methods中的方法实现详解

目录前言：开始前：使用第一步、定义全局mixin第二步添加代码提示d.ts声明文件在项目下新建jsconfig.json添加shims-vue.d.ts声明文件添加event-keys.d.ts声明文件第三步编写web...

• 2022-12-31

114浏览

0评论

Vue手机号正则匹配姓名加密展示功能的实现

目录一丶手机号二丶姓名一丶手机号（1）正则匹配if (!/^1[3|4|5|6|7|8|9]\d{9}$/.test(13807999985)) { console.log(resultPhone);//138****9985（2）substr截取 var phone =...

• 2022-12-31

93浏览

0评论

el-tree的实现叶子节点单选的示例代码

目录1、首先查看官网2、熟悉基本的代码2.1、参数说明：defaultProps2.2、对应的数据结构2.3、为什么要使用disabled属性呢？3、添加check事件，实现单选。完整源码效果要求：火车的...

• 2022-12-31

110浏览

0评论

老生常谈vue3组件通信方式

目录vue3七种组件通信方式1. Props方式2. emit方式3. v-model方式4、Refs5. provide/inject6. eventBus7. vuex/piniavue3七种组件通信方式面试题经常会问到vue3组件间的通...

• 2022-12-31

123浏览

0评论

使用VitePress搭建及部署vue组件库文档的示例详解

目录安装vitepress目录结构文档首页配置导航栏配置侧边栏部署到GitHub Pages每个组件库都有它们自己的文档。所以当我们开发完成我们自己的组件库必须也需要一个组件库文档...

• 2022-12-31

173浏览

0评论

Vue项目获取url中的参数(亲测可用)

目录情况一：内部页面之间互相传值情况二：外部跳转VUE项目时自带参数1 获取?后面的参数2 获取不带?的URL中的参数亲测可用，若有疑问请私信获取url参数有两种情况：情况一：内部页面...

• 2022-12-31

112浏览

0评论

Vue3 源码解读之 Teleport 组件使用示例

目录Teleport 组件解决的问题Teleport 组件的基本结构Teleport 组件 process 函数Teleport 组件的挂载Teleport 组件的更新moveTeleport 移动Teleport 组件hydrateTeleport...

• 2022-12-31

135浏览

0评论

vue3 elmentPlus table实现列宽可拖拽功能

el-table 里边的border属性，设置之后表格即可直接拖拽，下文内容是相关扩展功能的实现最近公司项目里边需求要让表格的宽度可拖动，我们的公司的项目有vue2的也有vue3的，表格分别...

• 2022-12-31

205浏览

0评论

c++游戏教程使用easyx做出大飞机

效果图这个打飞机小游戏素材都很一般，直接网上抠图下来的。但我们应该学习一下怎么入门这一款经典小游戏。游戏对象首先游戏对象就这几个东西// 全局画板IMAGE bk;IMAGE BK;I...

• 2022-12-31

129浏览

0评论

Vue动态组件component标签的用法大全

目录简介说明官网网址示例路由设置父组件子组件简介说明本文介绍Vue的动态组件的用法。在Vue中，可以通过component标签的is属性动态指定标签，例如：<component :is="componentNa...

• 2022-12-31

108浏览

0评论

vue高德地图JS API实现海量点标记示例

目录实现效果：JSAPI 的加载使用 JSAPI Loader (推荐)实现代码官方文档：海量点标记-覆盖物-教程-地图 JS API | 高德地图API需求：根据后台接口返回的部分数据，这里仅做展示 ，可参...

• 2022-12-31

129浏览

0评论

vue2从template到render模板编译入口详解

目录正文1、template：模板获取2、createCompiler：核心参数3、createCompileToFunctionFn：缓存处理4、compile:参数合并小结正文在vue的渲染过程中，渲染核心逻辑是vm._update(vm....

• 2022-12-31

126浏览

0评论

el-tree loadNode懒加载的实现

需要 lazy、 load 两个属性一起用<el-tree          :data="treeData"          :props="defaultProps"          :load="loadNode"          @nod...

• 2022-12-31

97浏览

0评论

Vue实现网页转PDF方法流程详解

目录需求背景功能要求功能实现过程window.print()方法使用html2canvas+jspdf实现需求背景我们平台在发货的时候需要打一张发货单，这张发货单上面需要显示客户的收货地址、发...

• 2022-12-31

106浏览

0评论

TSX常见简单入门用法之Vue3+Vite

目录1.安装tsx1.安装tsx插件2.vite.config.ts里的配置3.tsconfig.json里的配置2.使用TSX1.app.vue里的代码2.app.tsx的代码注意:总结1.安装tsx1.安装tsx插件npm install @vi...

• 2022-12-31

106浏览

0评论

Vue中v-on的基础用法、参数传递和修饰符的示例详解

一、v-on的基本用法使用v-on:click给button绑定监听事件以及回调函数，@是v-on:的缩写，也就是简写也可以使用@click。方法一般是需要写方法名加上()，在@click中可以省掉，如上述的...

• 2022-12-31

129浏览

0评论

vue新玩法VueUse工具库具体用法@vueuse/core详解

VueUse官方链接一、什么是VueUseVueUse不是Vue.use，它是为Vue 2和3服务的一套Vue Composition API的常用工具集，是目前世界上Star最高的同类型库之一。它的初衷就是将一切原本...

• 2022-12-31

96浏览

0评论

vue 实现滑动块解锁示例详解

目录引言下载需要用到的组件库书写登录页面template 结构：script 逻辑：style 样式：登录页面效果展示：写滑动解锁组件template 模板：script 代码:style 样式：将滑动组件运用到我们...

• 2022-12-31

118浏览

0评论

详解Vue注册组件的方法

目录简介说明官网网址组件名字全局注册（一般用于框架）局部注册（不常用）模块系统在模块系统中局部注册（常用）基础组件的自动化全局注册简介说明本文介绍Vue注册组件的方法。Vue注册...

• 2022-12-31

88浏览

0评论

Vue自定义名称下载PDF的方法

目录vue3.0带来了什么1.性能的提升 打包大小减少41%初次渲染快55%,更新渲染块133%内存减少54%........2.源码的升级 使用Proxy代替defineProperty实现响应式重写虚拟DOM的实...

• 2022-12-31

118浏览

0评论

Vue引入echarts方法与使用介绍

目录1. 引入echarts2. 将echarts设置为全局3. 在相关组件中使用在Vue中引入echarts以及使用今天来告诉大家如何将echart引入vue并巧妙利用钩子函数对表格数据进行渲染。1....

• 2022-12-31

160浏览

0评论

解决element ui cascader 动态加载回显问题

elementui是基于vue2.0的组件库，专为开发人员、设计人员而设计的；可以快速搭建项目框架，集成了界面样式，先给大家介绍下element ui cascader 动态加载回显问题解决方法。props:...

• 2022-12-31

149浏览

0评论

Vue项目报错:Uncaught SyntaxError: Unexpected token '＜'的解决方法

目录问题：一、public下的index.html没有引入其他外部js文件。二、 public下的index.html引入其他外部js文件。原因一.引用文件的位置不正确原因二：配置信息不正确原因三：script...

• 2022-12-31

99浏览

0评论

vue3+ts使用bus事件总线的示例代码

1、在vue2中我是这样使用的//创建一个vueBus.jsimport Bus from 'vue';let install = function (Vue) {Vue.prototype.$bus = new Bus()}export default {install};//在main...

• 2022-12-31

80浏览

0评论

vue中的循环遍历对象、数组和字符串

目录vue循环遍历对象、数组和字符串1.循环遍历对象2.循环遍历数组3.循环遍历字符串vue循环遍历,指令v-for1.循环遍历2.v-for遍历数组3.v-for遍历对象4.v-for使用中添加keyvu...

• 2022-12-31

96浏览

0评论

vue-router中关于children的使用方法

目录关于children的使用children的使用场景router配置中children配置不起作用关于children的使用children的使用场景比如页面左侧显示菜单，右侧显示不同菜单下的内容，类似如下...

• 2022-12-31

175浏览

0评论

Vue常见报错整理大全(从此报错不害怕)

目录示例1（文件名/路径发生错误）示例2（标签不完整）示例3（error &#39;xxx&#39; is not defind）示例4（unknown mutation type: changeA）示例5（Attribute name cannot contain U+0022 ("...

• 2022-12-31

111浏览

0评论

Vue子组件props从父组件接收数据并存入data

目录1.不允许直接修改2.存在异步的情况解决思路经过测试父组件中传递过来的数据有以下特点：1.不允许直接修改如果直接使用 this.xxx = action 操作的话 控制台会报下面这个错...

• 2022-12-31

115浏览

0评论

Vue中使用Ueditor的示例详解

目录一、下载Ueditor包 二、编译下载文件 三、在Vue项目中引用一、下载Ueditor包 官网地址：http://fex.baidu.com/ueditor/git地址： https://github.com/fex-team/ueditor 打...

• 2022-12-31

98浏览

0评论

Element UI table参数中的selectable的使用及遇到坑

Element UI table参数中的selectable的使用中遇到的坑：
页面： <el-table-column :selectable='selectable' type="selection" :reserve-selection="true"> </el-t...

• 2022-12-31

82浏览

0评论

Vue2中无法监听数组和对象的某些变化问题

目录一、数组1. 不能监听的情况2. 替代做法3. 注意二、对象1. 不能监听的情况2. 替代做法三、分析 vue 2 无法监听数组和对象的这些变化的原因1. 对于数组2. 对象四、vue 3...

• 2022-12-31

144浏览

0评论

vue element-ui里的table中表头与表格出现错位的解决

目录element-ui里的table中表头与表格出现错位解决方案element-ui表格样式错乱调整方式1、线没有对齐2、fixed固定导致的高度问题3、去掉鼠标hover修改背景色事件element-ui...

• 2022-12-31

88浏览

0评论

Vue实例初始化为渲染函数设置检查源码剖析

目录引言_renderProxy是干什么的initProxy方法总结引言之前的文章提到，Vue实例化时_init方法做了很多处理，其中就有这么一段：if (__DEV__) { initProxy(vm)} else { vm._rend...

• 2022-12-31

135浏览

0评论

一文详解Pinia和Vuex与两个Vue状态管理模式

目录前言安装挂载VuexPinia修改状态vuexPiniaPinia解构(storeToRefs)gettersPiniaVuexmodulesPiniaVuex写在最后前言Pinia和Vuex一样都是是vue的全局状态管理器。其实Pinia...

• 2022-12-31

110浏览

0评论

Vue计算属性与监视属性实现方法详解

目录一、计算属性1、插值语法实现2、通过方法实现3、通过计算属性二、监视属性三、深度监视一、计算属性在开发中，可以有这样的需求，在属性（date）中，有fistName和lastName两个属...

• 2022-12-31

109浏览

0评论

vue实现点击复制到粘贴板

本文实例为大家分享了vue实现点击复制到粘贴板的具体代码，供大家参考，具体内容如下背景： 业务开发中遇到，点击复制内容到粘贴板的需求，记录一下效果：关键代码:copyText() {   ...

• 2022-12-31

111浏览

0评论

vue实现二级弹框案例

本文实例为大家分享了vue实现二级弹框的具体代码，供大家参考，具体内容如下二级弹框案例，如下图所示<template>    <div class="zw-dialog">        <div class="zw-top">...

• 2022-12-31

235浏览

0评论

vue demi支持sfc方式的vue2vue3通用库开发详解

目录背景技术要点vue-demisfc compiler实现方式vue2.6 + vue3 + vite + vue-demipackage.jsonvite.config.tsmain.tspostinstallvue2.7 + vue3 + vite + vue-demi + yarn wo...

• 2022-12-31

110浏览

0评论

vue中实现监听数组内部元素

目录vue监听数组内部元素我们有两种办法解决此问题vue如何监听数组的变化vue监听数组内部元素在VUE中，对数组的监听是浅监听，也就是它只能监听到数组的长度或者有无的变化，当我...

• 2022-12-31

126浏览

0评论

如何在vue项目中使用UEditor--plus

目录1:UEditor-plus富文本编辑器如何在vue项目中使用2.使用方法3.运行项目1:UEditor-plus富文本编辑器如何在vue项目中使用备注：UEditor是由百度web前端研发部开发的所见即所...

• 2022-12-31