vue2学习日常
文章平均质量分 78
记录下vue学习过程中遇到的各类bug
暴怒的代码
目前在职,一位伪全栈工程师。欢迎相互交流与学习
展开
-
vue2中的watch(侦听器)讲解,以及解决深度监听新值和旧值相同的两种方案(手写深拷贝和JSON.parse())。
相信大家在开发项目中,有时候会遇到一些需求,是当一个数据改变之后进行一些操作,这个时候有些人会设置一个定时器,周期性的去循环访问,当发现数据发生了改变后执行操作。但是这种操作方式会导致系统资源的浪费,以及更新的不及时等。因此vue通过watch(侦听器)提供了一个更通用的方法来响应数据的变化,当需要在数据变化时执行异步或开销较大的操作时,这个方式是最有用的。原创 2023-08-25 11:11:19 · 6551 阅读 · 9 评论 -
vue2响应式布局
vue2中实现PC端响应式布局的方案原创 2023-08-23 13:52:56 · 513 阅读 · 0 评论 -
Element-UI 日期选择器--禁用未来日期
在做项目的时候经常会遇到一些报表需要填写日期,一般是填写当日及当日以前,这时候我们的日期选择器就需要进行一些限制原创 2023-10-17 15:49:37 · 540 阅读 · 1 评论 -
el-date-picker日期选择控件少一天的问题
这个是由于element-ui中时间控件的默认时间为国际标准时间,因此与北京时间差8个小时。原创 2023-10-11 16:18:10 · 1625 阅读 · 1 评论 -
Vue.prototype详解
在 Vue.js 中,经常会看到 this.$XXX 这种写法,那么这个是什么呢?其实这里就是使用 Vue.prototype 所定义的一个挂载到本身的全局方法,主要是为了防止全局变量的污染,所以我们来共同商议的一种写法。Vue.prototype 可以用来添加一些全局的属性或方法,使其在每个 Vue 实例中都可用。Vue.prototype 可以添加任何类型的属性或方法,比如:常量、对象、方法等。它是就是解决 替换全局使用的一个标识。原创 2023-10-10 09:43:01 · 1719 阅读 · 0 评论 -
VUE2中axios的使用方法
添加数据请求公用信息// const token = getCookie('名称');注意使用的时候需要引入cookie方法,推荐js-cookie},error => {原创 2023-09-26 07:46:38 · 341 阅读 · 0 评论 -
vue项目main.js的使用方法
是项目的入口文件,项目中所有的页面都会加载main.js。主要有三个作用:1.实例化Vue。2.放置项目中经常会用到的插件和CSS样式。3.存储全局变量。项目创建完毕,main.js中会有默认的配置,但是要想真正投入使用,这种简版的配置是不够的。以下通过配置三项内容让读者有个初步的了解,废话不多说开整。原创 2023-09-25 07:20:09 · 1830 阅读 · 0 评论 -
Vue 中如何使用自定义指令?
Vue 自定义指令是 Vue 提供的一种扩展方式,用来扩展 Vue 元素的行为和表现形式。Vue 自带的指令包括 v-model、v-bind、v-if 等,这些指令可以用来操作元素的属性、样式或者文本内容。而自定义指令可以让开发者定义自己的指令,从而实现更丰富的功能。比如可以定义一个自定义指令用来处理滚动事件,或者用来实现用户输入校验,或者用来实现表格排序等。Vue 自定义指令的定义方式非常简单,只需要调用 Vue.directive() 方法,并传入两个参数:指令名称和指令选项对象。原创 2023-09-24 20:52:52 · 117 阅读 · 0 评论 -
vue中$refs的基本用法
1、ref 加在普通的元素上,用this.$refs.(ref值) 获取到的是dom元素2、ref 加在子组件上,用this.$refs.(ref值) 获取到的是组件实例,可以使用组件的所有方法。在使用方法的时候直接this.$refs.(ref值).方法() 就可以使用了。3、如何利用 v-for 和 ref 获取一组数组或者dom 节点(:ref =某变量)说明:vm.$refs 一个对象,持有已注册过 ref 的所有子组件(或HTML元素)原创 2023-09-24 20:49:18 · 2264 阅读 · 1 评论 -
Vue内置指令——v-show和v-if指令
从生成的HTML结构中可以看出,索引不等于的元素被隐藏了,只是添加了CSS样式:display:node,但是该元素还存在。v-show指令可以用来动态的控制DOM元素的显示或隐藏。从生成的HTML结构中可以看出,索引不等于1的元素被隐藏了,这里是直接删除了img元素,不占用位置。v-if指令的用法和v-show指令的用法相同,都是用来控制DOM元素的显示或隐藏。v-show和v-if都可以用来控制DOM元素的显示或隐藏,那么这两个指令有什么区别呢?v-show="false", 表示隐藏DOM元素。原创 2023-09-24 14:37:42 · 2002 阅读 · 0 评论 -
浅谈vue动态组件
动态组件是指在一个挂载点使用多个组件,并进行动态切换。挂载点可以简单理解为页面的一个位置,最常见的应用场景是实现tab的切换功能。通过动态组件,可以根据不同的条件或事件,切换不同的组件来展示不同的内容。原创 2023-09-23 08:12:33 · 1316 阅读 · 0 评论 -
项目实战(附源码),基于Element实现自定义参数的upload文件上传,以及模板下载
实现基于element的带多个参数上传文件功能原创 2023-09-21 07:10:32 · 229 阅读 · 0 评论 -
项目实战(附源码),使用Element实现输入下拉搜索功能,以及增加删除保存全套
是基于Element组件所开发实现的。在一个表格里,首先数据可以切换编辑与浏览视图。在编辑视图下,可以新增与删除数据(第一条不可删),数据的列表是一个可通过输入数据进行检索的下拉列表,保存的时候会进行空值判断等。原创 2023-09-20 06:39:04 · 666 阅读 · 0 评论 -
使用vue2实现word,pdf等的在线预览
实现文件的World,Excel文件的在线预览原创 2023-09-19 08:14:26 · 2337 阅读 · 0 评论 -
Vue2之filters过滤器基础与进阶
Vue2的filters过滤器基础使用原创 2023-09-14 21:25:10 · 919 阅读 · 0 评论 -
项目实战(附源码),使用this.$set()实现<el-table>表格的点击编辑,点击空白保存功能。
在项目的实际开发中,根据用户的要求会遇到各种各样的需求。本功能就是在开发中所遇到的一个实际需求(这里有做简化,原需求会更麻烦一些)。于是本着学习与分享的思想,在这里对所写的代码进行分享。此代码是可以直接拿来用的,有需要源码的小伙伴可以从gitee获取,地址如下:vue2全家桶练习: 包含vue2下使用router路由跳转,vuex状态管理,inject注入,minixs混入,watch监听。原创 2023-09-13 15:04:02 · 345 阅读 · 0 评论 -
vue2的render函数详解
render函数和template一样,都是用来创建html模板的,但是有些场景里使用template实现起来会使代码冗余且复杂,因此产生了render函数。原创 2023-08-26 22:32:18 · 1148 阅读 · 0 评论 -
vue2的生命周期详解(代码演示+源码)
生命周期是vue2中一个很重要的知识点,同时也是面试中容易问到的高频面试点。熟练掌握了vue2的生命周期,可以让我们在项目开发过程中少走很多弯路,减少很多莫名其妙的bug,所以,希望本文能够对各位小伙伴有所帮助哦!原创 2023-08-25 15:47:47 · 5989 阅读 · 0 评论 -
小白也能看的懂,vue2使用Router进行路由配置?
总所周知,使用vue所开发出来的程序通常是单页面应用程序,这是现代web应用程序开发的重要方式。而这种单页面方式主要是通过路由(router)来支持与实现。单页面应用(SPA:single-page application),就是只有一张Web页面的应用,是加载单个HTML页面并在用户与应用程序交互时动态更新该页面的web应用程序。” -- from 百度百科路由的本质是一种对应关系,根据不同的url请求,返回所对应的不同资源。这样url和资源就有一种一一对应的关系,这就是路由。原创 2023-08-18 14:31:45 · 1256 阅读 · 4 评论 -
vue2父子组件传值(六种关系)
介绍了vue中组件传值的六种方法。原创 2023-08-09 10:52:14 · 1451 阅读 · 1 评论 -
vue的scoped注意事项
在vue中,scoped通常用来限制变量的作用域。在组件中,可以让每个组件都可以拥有自己的作用域,这样组件模板更加灵活和可读性更高。如果项目中所有的页面和组件都添加了scoped属性,可以让项目模块化,减少很多不知名的布局bug。原创 2023-08-08 07:48:06 · 117 阅读 · 1 评论