目录1.安装element-plus （3种方式 ）2. 在main.js种引用原因一原因二vue3.0 不兼容 element-ui ，于是推出了element-plus1.安装element-plus （3种方式 ）npm install element-plus...

目录什么是 Pinia如何使用 Pinia认识 Store定义一个store使用 store操作 StateGetters1. 认识和定义 Getters2. 访问 Getters认识和定义 Action什么是 PiniaPinia (西班牙语...

目录在setup()钩子函数中调用在<srcipt setup>中调用在setup()钩子函数中调用父组件<template> <div> 我是父组件 <children ref="childrenRef" /> <b...

在 VUE 中 {{{data}}} 和 v-html 属性会把内容解析成 html，可能会造成 xss 漏洞；以及 当使用 SSR（ Server Side Rendering（服务端渲染））， SSR 的时候忘记了转义和过滤而导致 XSS；vue...

目录需求实现需求1、利用on-preview+window.open()实现简易版预览效果2、封装组件实现更完整的上传完成、预览功能追加关于问的比较多的问题回复1、imgsrc路径2、显示原本el...

目录一、idea中vue项目的打包1、设置打包后项目的名称2、将项目打包3、生成的包内的文件如下：二、部署到服务器1、找到Nginx的安装位置2、 将打包后的vue项目文件放在html文...

目录引言1.示例2.源码解析2.1 参数解析2.2 响应式状态定义2.3 onScrollEnd滚动结束回调2.4 onScrollHandler滚动处理2.5 使用 useEventListener监听滚动事件2.6 返回值3.总...

目录一、生命周期图二、生命周期三个组成部分第一节-初始化beforeCreatecreatedbeforeMountmounted第二节-更新状态beforeUpdateupdated第三节-销毁实例beforeDestroydestro...

目录基于 Token 的验证流程Token 的组成HeaderPayloadSignature加密算法Django 生成和验证 Token处理 Token登录成功批发 Token中间件拦截验证 (Middleware)Vue 存储和携带...

目录基本使用响应式v-model数据双向绑定步骤响应式v-model简易实现原理v-model，被称为双向数据绑定指令，就是Vue实例对数据进行修改，页面会立即感知，相反页面对数据进行修改，Vue...

在一个非单文件组件中(一个文件中包含n个组件，最常见的就是单个html文件中存在多个组件)，如果我们需要在这个文件中创建n个组件，然后再页面上展示，这时候我们就需要先定义组件，然...

目录前言初始化计算属性依赖属性更新总结前言官网对计算属性的介绍在这里：传送门计算属性是Vue中很常用的一个配置项，我们先用一个简单的例子来讲解它的功能：<div id="app"> {...

目录1、使用vuecli创建vue项目2、安装electron3、vue项目安装Electron-builder打包工具4、在vue项目的src下有个background.js文件5、安装remote模块6、代码7、效果图1、使...

目录发现错误解决补充：el-date-picker 初始化报错总结发现错误这两天在写新项目的时候，遇到了element ui 时间日期选择器一直报错[Vue warn]: Avoid mutating a prop directly...

目录1. Vite2. 自动导入常见方法2.1 传统写法2.2 自动导入3. 组件去后缀4. name 属性问题小伙伴们知道 TienChin 项目前端用的是 Vue3，当我们把 Vue3 官网刷了一遍之后回来看...

目录错1: 执行 cnpm install / npm install 报错如下办法1：降低node.js版本办法2：降低版本依旧报错，执行相关命令报错2:core-js 缺失问题报错3: Connection was aborted, errno...

目录关于redirect(重定向)初学者的坑vue-router路由重定向redirect的使用事项关于redirect(重定向)初学者的坑第一个对象里是配置路由重定向path:&rsquo;/&#39;为项目的根目...

vue引入elementUi后打开页面报错本人在用idea创建vue项目并引入elemenUi之后网页报错：
Uncaught TypeError: Cannot read properties of undefined(reading &lsquo;prototype...

vant文档：Vant 2 - Mobile UI Components built on Vue实现效果： 代码实现：1.navbar、tabbar顶部导航过渡效果、颜色过渡；<div class="mallHead"> <van-nav-bar :title="...

目录1.监听事件2.事件处理方法3.带参数的时间绑定方法：4.内联处理器中的方法5.事件对象6.事件冒泡7.阻止默认行为：8.其他事件修饰符补充：原生JS阻止冒泡其实v-on后面跟的不止是...

目录前情提要经过(一)经过(二)经过(三)经过(四)最后附加总结前情提要事情的起因是项目在设计之初要求兼容IE11，也在开发之初对此做了处理，但在经过两年的多的迭代后，经过大几十...

目录vue3 获取元素高度不准页面获取元素高度和$el问题vue3 获取元素高度不准html：<transition name="slide-width">    <a-col class="fixed-small" v-show="isShow" :styl...

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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