03 2022 档案
摘要:Lazy-Load,翻译过来是“懒加载”。它是针对图片加载时机的优化:在一些图片量比较大的网站(比如电商网站首页,或者团购网站、小游戏首页等),如果我们尝试在用户打开页面的时候,就把所有的图片资源加载完毕,那么很可能会造成白屏、卡顿等现象,因为图片真的太多了,一口气处理这么多任务,浏览器做不到啊!
阅读全文
摘要:在项目中,有时候检测一个变量的值是否反升了变化。通常使用的watch或者使用低效的循环判断。 在次vue中给我们设置了深度监测数据繁盛变化的方法。 1.vue中提供了在watch监听时设置deep:true 就可以实现对对象的深度监听; 2.immediate:true,代表watch里面声明了之
阅读全文
摘要:热爱vue开发的同学肯定知道awesome-vue 这个github地址,里面包含了数以千计的vue开源插件,而这些插件大都来自第三方开发者们,是他们为vue社区提供了大量的技术支持和解决方案。本文立足vue开源的理念,主要为vue开发者讲解编写vue插件的方法和步骤,通过理论与实践相结合的方式来加
阅读全文
摘要:相比较于函数的封装,规模更大一点的便是组件的封装,组件包含了模版、脚本以及样式的代码,在实际开发中组件的使用频率也是非常大的,我们项目中的每一个页面其实都可以看作是一个父组件,其可以包含很多子组件,子组件通过接收父组件的值来渲染页面,父组件通过响应子组件的回调来触发事件。 封装一个组件主要包含两种方
阅读全文
摘要:在生活中,重复的机械劳动会消耗我们的时间和精力,提高生产成本,降低工作效率。同样,在代码世界中,编写重复的代码会导致代码的冗余,页面性能的下降以及后期维护成本的增加。由此可见将重复的事情复用起来是提高生产效率、降低维护成本的不二之选。 在 Vue 项目中,每一个页面都可以看作是由大大小小的模块构成的
阅读全文
摘要:该配置文件便是 Vuex 的配置文件,主要有 4 个核心点:state、mutations、actions 及 getter,详细的介绍大家可以参考官方文档:[核心概念](https://vuex.vuejs.org/zh/guide/state.html),这里我用一句话介绍就是:**我们通过 a
阅读全文
摘要:关于文件名:必须以如下方式命名,不要乱起名,也无需专门手动控制加载哪个文件 .env 全局默认配置文件,不论什么环境都会加载合并 .env.development 开发环境下的配置文件 .env.production 生产环境下的配置文件 关于文件内容: 注意:属性名必须以VUE_APP_开头,比如
阅读全文
摘要:<keep-alive>是Vue的内置组件,能在组件切换过程中将状态保留在内存中,防止重复渲染DOM。 <keep-alive> 包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。 <keep-alive> 与 <transition>相似,只是一个抽象组件,它不会在DOM树中渲染(真实或者虚
阅读全文
摘要:<area>标记主要用于图像地图,通过该标记可以在图像地图中设定作用区域(又称为热点),这样当用户的鼠标移到指定的作用区域点击时,会自动链接到预先设定好的页面。其基本语法结构如下: <area class=type id=Value href=url alt=text shape=area-shap
阅读全文
摘要:vue封装子组件,直接在父组件中写@click=function点击没反应,写 @click.native=function就可以了。@click.native是给组件绑定原生事件
阅读全文
摘要:<一> keepAlive的基础知识点 <1>在动态组件上使用 keep-alive 如果希望那些标签的组件实例能够被在它们第一次被创建的时候缓存下来。为了解决这个问题,我们可以用一个 <keep-alive> 元素将其动态组件包裹起来。 <!-- 失活的组件将会被缓存!--> <keep-aliv
阅读全文
摘要:1、准备两个页面 为兄弟关系 <User> <UserInsert/> </UserTable/> </User> 2、table页面写上ref 3、insert页面添加完数据调用table页面的刷新方法insert页面内 user页面内
阅读全文
摘要:$attrs的使用 vue $attrs是在vue的2.40版本以上添加的。 项目中有多层组件传参可以使用$attrs,可以使代码更加美观,更加简洁,维护代码的时候更方便。如果使用普通的父子组件传参prop和$emit,$on会很繁琐;如果使用vuex会大材小用,只是在这几个组件中使用,没必要使用v
阅读全文
摘要:一、概念解析 成对出现:provide和inject是成对出现的 作用:用于父组件向子孙组件传递数据 使用方法:provide在父组件中返回要传给下级的数据,inject在需要使用这个数据的子辈组件或者孙辈等下级组件中注入数据。 使用场景:由于vue有$parent属性可以让子组件访问父组件。但孙组
阅读全文
摘要:在VUE中路由遇到Error: Avoided redundant navigation to current location:报错显示是路由重复 在router文件夹下的index.js中加入如下代码,错误消失 const originalPush = VueRouter.prototype.p
阅读全文
摘要:1 1、数字数组转化为字符串数组 var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; arr.map(String); //结果: ['1', '2', '3', '4', '5', '6', '7', '8', '9'] 1 2、字符串数组转化为数字数组 var a =
阅读全文
摘要:基本类型 typescript可以理解为就是加了类型标注的javascript。 这样就可以在写代码的时候帮助们进行代码的校验,主要是数据格式的校验,不过最终typescript的代码还是需要转成javascript,这样才能在浏览器中运行,转换暂时不用考虑,vue开发环境支持编译typescrip
阅读全文
摘要:vue要实现动画很简单,同时他提供了很多种实现方式,为了快速入门,这里只讲一种最简单实用的方法,就是结合 animate.css 这个css动画库。 https://animate.style 准备工作 安装animate.css npm install animate.css --save 在ma
阅读全文
摘要:之前项目遇到个情况,npm run build打包之后上传到服务器后,index.html打开一片空白,资源都加载了,但是就是不显示。 然后百度找了原因,修改了两处地方 一、修改 assetsPublicPath 在config/index.js里面,有个 assetsPublicPath 属性,源
阅读全文

浙公网安备 33010602011771号