51工具盒子

依楼听风雨
笑看云卷云舒,淡观潮起潮落

vuejs

新版vue项目的创建

新版vue项目的创建

厉飞雨 阅读(89) 评论(0) 赞(13)

<p><a href="https://npm.taobao.org/mirrors/node/v14.8.0/node-v14.8.0-x64.msi">下载<code>nodejs</code></a></p> <p>然后一直下一步安装就行</p> <p...

Vue3图片懒加载

Vue3图片懒加载

厉飞雨 阅读(122) 评论(0) 赞(11)

背景 {#背景} -------- 界面很长,屏幕不能一下装下所有内容,如果以进入首页就把所有内容都加载完的话所需时间较长,会影响`用户体验`,所以可以当用户浏览到时再去加载。 代码 {#代码} -------- ### 新建index.js文件 {#新建indexjs文件} src下新建directives文件夹,并新建index.js文件 ```hljs lang...

vue3开发h5页面实现扫描二维码功能

vue3开发h5页面实现扫描二维码功能

厉飞雨 阅读(240) 评论(0) 赞(13)

<h2>安装依赖</h2> <p>html5-qrcode 是一个用于在现代浏览器中进行二维码扫描的 JavaScript 库。它利用 HTML5 的 getUserMedia API 来访问设备的摄像头,并使用 QRCode 库来解码二维码。这个库非常适合在 Web 应用中实现二维码扫描功能,尤其是在移动设备上。</p> <...

vue2学习笔记

vue2学习笔记

厉飞雨 阅读(84) 评论(0) 赞(11)

01、初识 Vue {#01%E3%80%81%E5%88%9D%E8%AF%86-vue} ---------------------------------------------- 1. 想让 Vue 工作,就必须创建一个 Vue 实例,且传入一个配置对象; 2. root 容器里面的代码依然符合 html 语法,只不过混入了一些特殊的语法; 3. root 容器里面的...

vue3 中父子组件数据传输踩坑

vue3 中父子组件数据传输踩坑

厉飞雨 阅读(88) 评论(0) 赞(15)

本文最后更新于 2024-10-24,文章内容可能已经过时。 问题背景 {#问题背景} ------------ 最近在开发 halo 插件过程中,遇到了一个这样的问题,后台使用的 vue3 框架,其中涉及到了父子组件传值,带着 vue2 的开发习惯,对子组件绑定了后端异步获取的数据,以及相应事件,由子组件来渲染获取到的数据。并处理相应逻辑。父子组件代码如下: * 父组件...

Vue Router 搭配 NaiveUI 的进度条

Vue Router 搭配 NaiveUI 的进度条

厉飞雨 阅读(137) 评论(0) 赞(15)

<h2>介绍 {#介绍}</h2> <p>由于 naive ui 的进度条需要依赖于一个 <code>NLoadingBarProvider</code>,所以我们在定义 <code>router</code> 的时候是无法使用 <code>useLoadingBar()</c...

异步加载 Vue 组件以减小 chunk 体积

异步加载 Vue 组件以减小 chunk 体积

厉飞雨 阅读(254) 评论(0) 赞(10)

<h2>问题 {#问题}</h2> <p>当你的组件过于复杂时,这里指它引用了非常多的第三方库,那么当你打包的时候或许会碰到下面的警告:</p> <p>|-----------------|-----------------------------------------------------------------...

vue3 路由的引入和配置

vue3 路由的引入和配置

厉飞雨 阅读(124) 评论(0) 赞(16)

<p>在 Vue 中,<code>router</code> 是一个核心插件,负责管理应用的路由配置,实现单页面应用(SPA)中的页面导航和组件切换,使得开发者能够通过定义路由映射来动态加载和渲染不同的组件,从而构建复杂的用户界面和交互体验。官方网站<a href="https://router.vuejs.org/"...

Vue 中 KeepAlive 的用法全解析

Vue 中 KeepAlive 的用法全解析

厉飞雨 阅读(155) 评论(0) 赞(12)

<ol> <li>前言</li> </ol> <hr /> <p>在 Vue 开发过程中,我们常常会碰到组件频繁切换的情况。大家都知道,组件每一次切换时的创建与销毁,其实都在消耗着系统资源,这可能会对应用的性能产生影响,甚至让用户体验大打折扣。而 Vue 为我们提供的 KeepAlive 组件,就像是一把优...