- 博客(19)
- 收藏
- 关注
RSS订阅原创 Vue匿名组件使用keep-alive后动态清除缓存
不过在这之前我们还得解决一个问题，由于此方法是拦截了路由离开事件，而当我们关闭不是当前激活的标签页时是不会触发路由离开事件的，这就会导致清除该缓存失效，所以我们得在关闭不激活的标签页时先模拟一次点击事件才能达到预期的效果。有了include和exclude对组件进行筛选，然后动态的记录tabs中打开的组件名，这就完美的解决了动态缓存的问题。但是，在项目开发中，为了提升页面加载的速度，一般会采用路由懒加载的方式加载路由组件，这时调用的组件不再是通过组件名，而是匿名组件。来缓存组件内部状态，避免重新渲染。
2023-04-24 14:45:39
1726
原创 判断数据类型的四种常用方法
使用Object.prototype.toString.call():对于 Object.prototype.toString() 方法，会返回一个形如 "[object XXX]" 的字符串，其中XXX即为当前数据的数据类型，因为只需要截取出来即可。使用typeof判断：typeof方法主要用来判断简单数据的数据类型，比如：String，Number，Boolean，undefined，而Array，Object，Date，RegExp只能返回为object；
2023-03-20 14:01:13
517
原创 通过iview组件库渲染树形结构tree
来完成，但是需求有可能要实现的功能不一样，我本次开发的需求不仅是渲染出树形的组织结构，还要有相应的。引用这三步之后，只需要把里面的功能做出改动以及下拉菜单的点击事件做出改动即可。在很多后台管理项目中，我们都会遇到要开发与。相关的需求，此时我们基本都要用到。
2022-11-24 11:20:23
854
原创 前端使用toFixed()保留小数位数的三个坑
很多时候，我们需要计算出百分比，比如在进度条上，需要保留两位小数或者整数，这个时候回使用到toFixed(0)，或者toFixed(2)，这种形式来保留小数位数，但是使用这个方法会有两个问题：（一），如果数据是0的情况下，0.toFixed(0)这样使用会报错，（三），在使用parseFloat和toFixed保留两位小数后再乘100，，并不是两位的小数了，所以写法应该做一些改动，才能保证数据的准确性。，如果我们期望得到一个数值，那么需要再转化为Number类型；（二），使用toFixed方法转化后，
2022-10-12 10:38:59
3072
4
原创 vue实现语音文件下载功能
其实代码量不大，基本也可以适用于所有的语音文件下载功能，实现方法就是绑定当前行的点击事件，然后拿到语音文件数据，调用后端接口，获取真正的语音文件，然后创建"a"标签，将语音文件和定义的文件名传给a标签，具体代码如下，适用所有场景
2022-09-23 11:34:52
1414
原创 前端vue项目打包出现警告且在测试环境打不开页面及控制台报错ChunkLoadError问题解决方案
直接上警告及报错的效果图，图一是在打包过程中出现的警告提示（注意：这个警告可能会在打包过程中一闪而过，被下面的内容覆盖导致忽略此警告），图二是环境上，点击导航栏后，页面打不开，并且控制台报错信息，而且打包文件明显过大，压缩后的包文件也同样明显过大...
2022-08-29 14:55:28
2452
原创 前端vue项目中解决通过路由导航跳转到的页面和引入注册为组件的页面数据同步刷新的问题的解决方案
前端vue项目中解决通过路由导航跳转到的页面和引入注册为组件的页面数据同步刷新的问题的解决方案
2022-08-24 14:55:58
654
原创 vue2选项式API和vue3组合式API区别的通俗解释
vue3对于这种代码布局的方式进行了优化，引出了组合式API,所展现的代码风格如下图，它的特点是特定功能相关的所有东西都放到一起维护，比如功能A相关的响应式数据，操作数据的方法，watch监听方法，computed计算属性等放到一起，形成代码功能上的模块化，这样不管应用多大，都可以快读定位到某个功能的所有相关代码，维护方便，设置如果功能复杂，代码量大，我们还可以进行逻辑拆分处理，代码逻辑更清晰，可读性更强，后期维护的同学不会像vue2中那么痛苦。...
2022-07-29 18:05:05
3879
原创 js中使用Object.is进行对象比较
Object.is 方法与严格相等比较运算符 === 有些不同。大部分情况下，Object.is(a, b) 与a === b 等价。但是有两种情况不同：NaN；-0 和 +0。
2022-07-19 17:03:35
632
原创 vue项目中页面添加水印
很多时候在后台管理系统中，有在页面中添加员工姓名的水印的需求，保证系统的安全性。可以定一个如下的方法，提供。供选择，第二种更简洁，也是我目前使用的，很稳定。最后在页面的created生命周期函数中调用即可。
2022-07-13 18:24:46
4812
5
原创 vue项目里在子组件内通过this.$parent无法获取父组件数据和方法的问题
vue项目里在子组件内通过this.$parent无法获取父组件数据和方法的问题
2022-07-08 14:14:43
5981
1
原创 axios配置中transformRequest和transformResponse的作用
transformRequest：作用：标识允许向服务器发送请求前发送数据；使用要求：只能用在put，post，patch这几个方法；后面数组中的函数，必须返回字符串，或 ArrayBuffer，或 Stream。用法：transformRequest: [function (data, headers) { // 对 data 进行任意转换处理 return data; }],使用场景：对post请求的data数据进行加密处理transformResp
2022-05-26 17:42:04
2718
原创 ES6新增的Promise的理解和基本使用
promise是解决我们异步编程的解决方案，让我们的异步代码看起来更加优雅容易维护。首先我们要了解的是promise的三种状态，pending（等待），resolved（已完成）触发then方法，rejected（已拒绝）触发catch方法。下面是经典的定时器异步回调示例：可以看出，我们要想达到以此执行异步任务，那么只能进行嵌套，如果有很多个异步任务都是依赖于上一个异步任务执行完毕，那么就形成了我们俗说的回调地狱，当项目逐渐庞大时，就意味着我们的更新维护将会异常的苦难。因此，promis
2022-05-25 18:46:31
170
原创 ivew组件库切换不同的tab展示不同的table表格的columns图标
效果如下图：在其中一个tab页的table中根据不同的数据的状态动态渲染出电话图标（有的数据里有图标有的数据里没图标），在其他的tab页则没有电话图标呈现这一列。首先如何呈现在其中某个tab页里展示图标其他tab页中则没有，其实就是对table绑定的columns数组进行操作，根据tab切换时的name进行判断，如果是需要展示本列的数据的name，则给当前column项的width给值，反之则给0，其次，当前column列的图标怎么动态渲染呢，就需要用到render函数了，在函数中创建icon或者其它.
2022-05-25 17:18:54
320
原创 前端npm安装jquery报错To install it, you can run: npm install --save jquery解决方案
当我们在刚拉取下项目，通过npm install命令安装依赖后，在启动运行项目时，出现报错信息，并提示如下：让通过此命令安装jquery，但是当我们在终端执行此命令的时候，又出现报错信息：不论我们怎么安装jquery都没有用，解决方案：通过执行cnpm i jquery -s命令安装即可解决。...
2022-05-13 17:21:54
4512
1
原创 前端npm安装开发环境和生产环境依赖的命令
对于很多新接触前端项目的小伙伴，刚开始对项目所需要的包的安装命令比较陌生，下面我进行区分：首先时开发环境的包，即只是我们在进行开发的时候需要的依赖，比如eslint，vue-cli，sass，less等等；在生产环境时的依赖是指项目在上线后，依旧需要的依赖，比如vue，vue-router，vuex，axios，element-ui等等；那么安装开发环境依赖和生产环境依赖的命令分别是什么呢？在我们的vue项目中的package.json文件中，"dependencies"配置对象即是生产环境
2022-04-28 20:27:07
2750
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人