![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
vue 随笔
小墨鱼_z
finding
展开
-
【vue】生产环境去除console.log
推荐下面这种方式,不用插件,main.js中判断生产环境后window.console.log = function (){};即可,vue-cli5实测可行,vue-cli3,4也可行。试了很多插件 无效果。原创 2024-08-21 18:10:18 · 103 阅读 · 0 评论 -
【element-ui】el-date-picker动态设置picker-options
【代码】【element-ui】el-date-picker动态设置picker-options。原创 2024-06-20 09:23:17 · 563 阅读 · 0 评论 -
【vue】在父组件监听子组件的生命周期方法 ---@hock
当然 @hook 方法不仅仅是可以监听 mounted,其它的生命周期事件,例如:created,updated 等都可以监听。父组件监听到 mounted 钩子函数 ...子组件触发 mounted 钩子函数 ...原创 2024-06-17 14:42:19 · 305 阅读 · 1 评论 -
【vue】vue生命周期
vue实例从创建到销毁的过程,就是生命周期。也就是从开始创建,初始化数据,编译模板,挂载dom->渲染,更新dom->渲染,写在等一系列过程,我们称这就是vue的生命周期。beforeMount:data,虚拟dommounted:data,真正dom。原创 2024-06-05 09:21:24 · 694 阅读 · 0 评论 -
【vue】v-for只显示前几个数据,超出显示查看更多
v-for只显示前几个数据,超出显示查看更多。原创 2024-05-30 16:50:01 · 597 阅读 · 1 评论 -
【vue】keep-alive:true缓存导致页面数据不刷新
activated:页面第一次进入的时候,钩子触发的顺序是created->mounted->activated。keep-alive生命周期钩子函数:activated、deactivated。deactivated: 页面退出的时候会触发deactivated,当再次前进或者后退的时候只触发activated。使用会将数据保留在内存中,如果要在每次进入页面的时候获取最新的数据,承担原来created钩子中获取数据的任务。需要在activated阶段获取数据,原创 2024-05-13 13:50:47 · 379 阅读 · 0 评论 -
【element-ui】el-select multiple多选,表单校验问题解决方法
在项目开发过程中发现,el-select设置了multiple支持多选属性之后,el-select赋值之后,表单校验不通过。、prop属性、rules校验是否正确,这里注意el-select的rules校验的trigger应该是change。注意rule中验证方式应该是“change” @change="vulTypeChange()"如果以上都没问题,那么还有一个原因就是:嵌套太深,导致form检测不到ruleForm的变化。1、添加form表单:rule方式验证,并且给下拉框添加change函数。原创 2024-02-28 11:16:33 · 2363 阅读 · 0 评论 -
【element-ui】el-select下拉框el-date-picker弹出框定位问题解决方案
有时候popper-append-to-body设置成false不生效,此时需要找到el-select对应的父节点设置样式:overflow:inherit!项目开发过程中发现el-select和el-date-picker弹出框显示时候,滚动屏幕,导致弹出框定位出现问题。2、el-date-picker提供了append-to-body属性的配置。1、select提供了popper-append-to-body属性的配置。首先考虑到看一下element-ui官网提供的api,如下图。原创 2024-02-06 10:10:44 · 2163 阅读 · 0 评论 -
【vue】报错 Duplicate keys detected 解决方案
【代码】【vue】报错 Duplicate keys detected 解决方案。原创 2024-02-02 10:53:46 · 3105 阅读 · 0 评论 -
【npm】npm i 与 npm install 的区别
4.npm i 安装出现问题是不会出现 npm-debug.log 文件的,但是 npm install 安装出现问题是有这个文件的。1.使用npm i 安装的模块和依赖,使用npm uninstall是无法删除的,必须使用 npm uninstall i 才可以删除。2.npm i 会帮助检测 和 当前 node 最匹配的 npm 版本号,并匹配出相互依赖的npm 包应该升级的版本号。3. npm i 安装的一些包,在当前的node版本下是没有办法使用的,必须使用建议版本。原创 2024-01-09 19:04:52 · 1150 阅读 · 0 评论 -
【vue】$bus 跨组件调用方法
vue bus原创 2023-12-20 18:55:47 · 439 阅读 · 0 评论 -
【vue】Vue项目中如何在父组件中直接调用子组件的方法
【代码】【vue】Vue项目中如何在父组件中直接调用子组件的方法。原创 2023-11-15 14:18:14 · 1715 阅读 · 0 评论 -
【element-ui】 el-form之rules赋值后校验没消失
错误原因是在return中定义了一个空对象formLabel,在校验过程中,formRules值找不到对应的formLabel值,此时就出现了在输入框中赋值之后,校验不消失。原创 2023-09-06 11:14:09 · 3197 阅读 · 0 评论 -
【vue】el-table 数据更新后,刷新表格数据
表格里面的数据更新后,可以通过以下方法来刷新表格。原创 2023-08-22 10:38:05 · 5015 阅读 · 0 评论 -
【vue】Vue中class样式的动态绑定
样式个数、类名确定,通过Bollean动态展示与否。注意:字符串使用的是vue实例data中已有的属性。:需要绑定的样式个数不确定,类名也不确定。原创 2023-07-27 20:38:50 · 2279 阅读 · 0 评论 -
【vue】vue面试高频问题之-$nextTick的作用和使用场景
我们先来看这样一个场景:有一个div,默认用 v-if 将它隐藏,点击一个按钮后,改变 v-if 的值,让它显示出来,同时拿到这个div的文本内容。理论上,我们应该不用去主动操作DOM,因为Vue的核心思想就是数据驱动DOM,但在很多业务里,我们避免不了会使用一些第三方库,比如 popper.js、swiper等,这些基于原生javascript的库都有创建和更新及销毁的完整生命周期,与Vue配合使用时,就要利用好$nextTick。知道了Vue异步更新DOM的原理,上面示例的报错也就不难理解了。原创 2023-07-25 15:39:14 · 346 阅读 · 0 评论 -
【vue】vue history和hash用法和区别
vue history和hash用法和区别原创 2023-07-17 09:53:43 · 134 阅读 · 0 评论 -
【vue】vue中query和params的区别
区别:1、query用path编写传参地址,而params用name编写传参地址;2、query刷新页面时参数不会消失,而params刷新页面时参数会消失;3、query传的参数会显示在url地址栏中,而params传参不会显示在地址栏中。原创 2023-07-17 09:35:08 · 399 阅读 · 0 评论 -
【vue】 下载excel文件
【代码】vue 下载excel文件。原创 2023-05-08 12:22:12 · 414 阅读 · 1 评论 -
【vue】 vant-upload多选上传图片
官方给出的上传回调有很多种,before-read after-read before-delete 结合需求以及代码优化 我们这里只用到了 after-read 亲测好用。是的,既然图片是多张上传,肯定需要数量限制嘛,不然整个几百张那也得炸…原创 2023-05-27 17:38:26 · 2261 阅读 · 1 评论 -
【vue】vue 子组件向父组件传参
vue 子组件向父组件传参原创 2023-07-03 17:20:44 · 135 阅读 · 1 评论 -
【vue】vue的模版引擎
Vue是一款流行的前端框架,它的模版引擎是Vue的一个非常重要的特性。Vue的模版引擎允许我们在 HTML 中使用 Vue 的语法来编写模版,而不需要使用繁重的 JavaScript 代码来操作 DOM,大大提高了开发效率。最后,我们需要注意 Vue 的模版引擎仅仅是 Vue 的一部分功能,与 Vue 的实例和组件密切相关。在使用 Vue 的模版引擎时,我们需要牢记 Vue 实例的生命周期、数据绑定规则和组件通信等重要概念,以便能够快速构建出高质量的应用程序。在使用这些模版语法时,我们需要注意一些细节。原创 2023-07-13 22:54:08 · 528 阅读 · 0 评论 -
【vue】vue生命周期函数分别有哪些
销毁前、销毁后(beforeDestroy、destroyed)- 不要在beforeDestroy进行数据的操作,不会再走更新流程。- 创建前、创建后(beforeCreate、created)- 更新前、更新后(beforeUpdate、updated)- 挂载前、挂载后(beforeMount、mounted)- 取消订阅、事件监听。- 销毁后自定义事件失效。- 常用的生命周期函数。原创 2023-07-10 16:21:06 · 55 阅读 · 0 评论 -
【vue】 什么是MVVM模型,说下你的理解
Vue采用Object.defineProperty 的 getter 和 setter结合观察者模式实现数据绑定。- 开发者只需关注业务逻辑,复杂的数据状态维护由 MVVM 来统一管理。- VM:ViewModel(视图模型) Vue实例对象。- 核心是对View 和 Model 的双向数据绑定。- 可以在Model中定义和修改数据以及操作业务逻辑。- M:Model(模型) 对应data的数据。- 实现了 Model和View的数据响应式。- 在vue中的MVVM(实现双向绑定原理)原创 2023-07-10 16:17:04 · 96 阅读 · 0 评论 -
【vue】vuex的五个属性及使用方法
它是Vue实例的data属性的替代品,但是通过它存储和管理的状态,可以在整个应用程序中实现全局共享,即不同的组件可以通过定义的getter和setter访问同一状态数据。mutations:用于修改state中的数据,是唯一可以修改state的地方。Vuex是Vue.js的状态管理库,它提供了一种集中式存储管理应用程序中所有组件的状态,并将其分离到一个可预测的状态容器中。getters:用于获取State中的状态,主要用于对state进行逻辑上的组合和应用,类似于Vue组件中的计算属性。原创 2023-07-06 16:00:30 · 450 阅读 · 1 评论 -
利用a标签携带token实现下载
el-button size="mini" type="primary" @click="handleExport">导出原创 2023-06-27 15:19:56 · 1763 阅读 · 0 评论