编程开发 - 教程之家

79浏览

0评论

Vue状态管理库Pinia详细介绍

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

2022-12-31 22:46:01

93浏览

0评论

vue3 setup中父组件通过Ref调用子组件的方法(实例代码)

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

2022-12-31 22:45:58

101浏览

0评论

vue使用csp的简单示例

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

2022-12-31 22:45:57

124浏览

0评论

vue+elementUI实现多文件上传与预览功能实战记录(word/PDF/图片/docx/doc/xlxs/txt)

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

2022-12-31 22:45:55

99浏览

0评论

将VUE项目部署到服务器的详细步骤

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

2022-12-31 22:45:52

113浏览

0评论

vue前端框架vueuse的useScroll函数使用源码分析

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

2022-12-31 22:45:49

76浏览

0评论

Vue生命周期深入分析总结

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

2022-12-31 22:45:46

94浏览

0评论

Vue 和 Django 实现 Token 身份验证的流程

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

2022-12-31 22:45:42

58浏览

0评论

vue双向数据绑定指令v-model的用法

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

2022-12-31 22:45:40

75浏览

0评论

关于Vue-extend和VueComponent问题小结

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

2022-12-31 22:45:38

67浏览

0评论

手写实现Vue计算属性

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

2022-12-31 22:45:35

360浏览

0评论

electron vue 模仿qq登录界面功能实现

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

2022-12-31 22:45:34

100浏览

0评论

element ui时间日期选择器el-date-picker报错Prop being mutated:"placement"解决方式

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

2022-12-31 22:45:32

90浏览

0评论

Vue3 中的插件和配置推荐大全

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

2022-12-31 22:45:29

64浏览

0评论

Vue环境搭建报错整理大全

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

2022-12-31 22:45:26

324浏览

0评论

vue中关于redirect(重定向)初学者的坑

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

2022-12-31 22:45:23

84浏览

0评论

vue引入elementUi后打开页面报错Uncaught TypeError的解决方式

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

2022-12-31 22:45:21

41浏览

0评论

vue navbar tabbar导航条根据位置移动实现定位、颜色过渡动画效果的代码

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

2022-12-31 22:45:18

75浏览

0评论

vue常用事件v-on:click详解事件对象,事件冒泡,事件默认行为

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

2022-12-31 22:45:11

78浏览

0评论

vue项目兼容ie11的实现方法

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

2022-12-31 22:45:10

64浏览

0评论

vue3 获取元素高度不准的问题

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

2022-12-31 22:45:08

67浏览

0评论

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

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

2022-12-31 22:45:06

153浏览

0评论

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

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

2022-12-31 22:45:03

71浏览

0评论

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

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

2022-12-31 22:44:59

78浏览

0评论

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

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

2022-12-31 22:44:58

65浏览

0评论

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

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

2022-12-31 22:44:56

70浏览

0评论

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

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

2022-12-31 22:44:54

67浏览

0评论

vue和react中关于插槽详解

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

2022-12-31 22:44:52

79浏览

0评论

Vue3 源码解读静态提升详解

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

2022-12-31 22:44:50

80浏览

0评论

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

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

2022-12-31 22:44:48

64浏览

0评论

教你在vue 中使用 svg symbols

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

2022-12-31 22:44:46

49浏览

0评论

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

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

2022-12-31 22:44:40

73浏览

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 22:44:38

55浏览

0评论

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

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

2022-12-31 22:44:37

70浏览

0评论

老生常谈vue3组件通信方式

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

2022-12-31 22:44:34

81浏览

0评论

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

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

2022-12-31 22:44:33

127浏览

0评论

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

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

2022-12-31 22:44:27

68浏览

0评论

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

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

2022-12-31 22:44:26

94浏览

0评论

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

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

2022-12-31 22:44:24

169浏览

0评论

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

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

2022-12-31 22:44:20

77浏览

0评论

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

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

2022-12-31 22:44:18

72浏览

0评论

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

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

2022-12-31 22:44:16

82浏览

0评论

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

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

2022-12-31 22:44:14

86浏览

0评论

el-tree loadNode懒加载的实现

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

2022-12-31 22:44:12

60浏览

0评论

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

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

2022-12-31 22:44:11

58浏览

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 22:44:09

65浏览

0评论

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

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

2022-12-31 22:44:07

87浏览

0评论

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

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

2022-12-31 22:44:05

58浏览

0评论

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

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

2022-12-31 22:44:03

65浏览

0评论

详解Vue注册组件的方法

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

2022-12-31 22:44:01

热门文章