- 博客(25)
- 收藏
- 关注
RSS订阅原创 table 的rowspan的作用
在制作表格的时候 我们可能有需求将相同的列合并，这就需要用到rowspan，rowspan是占用多少列,colspan是指占用多少行。
2023-03-10 22:50:38
166
原创 vue 升级到vue3踩坑记录（vue和element）
最近在把公司项目从vue2+element 升级到 vue3+elementPlus，实实在在遇到很多问题，先在把报错信息捋一捋。1.Runtime directive used on component with non-element root node意思是自定义指令不能放到组件上，而是要放到自有的元素上2.element-plus icons不能用动态class的方式导入需要做：将icons全局导入，然后用 <ElIcon> <component :is
2021-11-10 16:59:44
9624
5
原创 vue element里面的table的封装
封装的table支持复合头部表格，单元格支持自定义组件，支持分页，支持自定义显示列，支持点击事件等等的复合型通用表格，废话不多说，上代码~table/index.vue 文件<template> <div class="commonTable"> <div class="flex-row-reverse"> <img v-if="showExport" class="icons m-l-10" src="../../assets/导出.p
2021-09-24 17:22:07
573
原创 vue中$slots和$scopeSlots的区别
最近在写一个组件，在子组件中要获取到具名插槽的名字，然后再渲染出来，一开始用了slots但我一旦加上作用域，这个插槽就显示不出来了，后面通过一层一层的调试，终于发现原来是slots 但我一旦加上作用域，这个插槽就显示不出来了，后面通过一层一层的调试，终于发现原来是slots但我一旦加上作用域，这个插槽就显示不出来了，后面通过一层一层的调试，终于发现原来是slots搞的鬼，后来看了一下官方文档，发现slots和slots和slots和scopedSlots还是有区别的。说的通俗一点就是scopedSlots
2021-09-24 14:22:14
1905
1
原创 webpack 和 babel的区别
区别：babel是js编译工具，能将es6或者一些特殊语法做一些转换webpack 能做的事情比较多，它可以加载很多的loader处理js，css，img，ts，vue等文件，最终输出js文件。可以这么说 webpack包含babel
2021-07-23 09:24:22
928
原创 react中 useEffect 和 useLayoutEffect相同和区别
相同点：都是在函数更新后执行，使用的方法也相同不同点：useEffect 是在dom更新后异步执行 。useLayoutEffect 是在dom更新前同步执行（有可能会阻塞dom渲染），执行完再更新dom。useLayoutEffect可以解决更新dom时候屏幕闪烁的问题...
2021-07-19 17:45:31
435
原创 浏览器hash和history的区别
两者的目的：vue或者react框架中，url变化不去请求服务器不同点：很直观区别就是hash模式有带#,history模式就是一个正常的传统的路由。hash模式监听的是onhashchange 方法来控制前端路由，history模式是监听popState来控制前端路由，history模式需要后端做一个支持，在找不到页面时候指向index页面，而hash模式不需要...
2021-07-08 09:24:18
241
原创 requestAnimationFrame 和setTimeout 的区别
相同点：都是宏任务不同点：一般先执行setTimeout 然后再执行requestAnimationFrame，setTimeout是微任务结束后就立刻执行的主任务（有可能是多帧执行一次或者一帧执行多次），requestAnimationFrame 是每一帧执行一次...
2021-05-27 16:51:57
200
原创 浏览器强缓存和协商缓存的区别
强缓存：两个字段控制： Expires 和 Cache-ControlExpires 是以前用来控制缓存的http头，Cache-Control是新版的API。 现在首选Cache-Control。 如果在Cache-Control响应头设置了"max-age" 或者"s-max-age" 指令，那么Expires 头会被忽略协商缓存：两个字段控制：Last-Modified 和 ETagLast-Modified 和 ETag 的区别：一个是具体的修改时间 一个是一个状态码，通过该状态码访问服务器是
2021-05-26 10:44:26
550
原创 react求精日志
1.useMemo和useCallback的区别useMemo返回的是一个值 useCallback返回的是一个函数，就像vue里面compute和watch的一样。
2021-05-24 15:18:02
44
原创 js获取数组最深层级的算法
最近有一个需求，有一个数组，数组里面有是一个个的对象，对象里面有可能有一个属性children 这个children是一个数组，里面的对象也很有可能有一个数组，这样不固定，求该数组的最深层级是多少代码如下： function getArrayLayer(arr, attr, index = 1) { let newIndex = index; for (const iterator of arr) { let tempIndex = index
2021-05-20 15:35:52
2087
原创 vue3里面的ref和reactive的区别
相同：都能对一个变量动态响应，包括对象，基本类型和数组不同：reactive定义的对象解构后无法是动态的
2021-05-19 11:46:27
569
原创 java @autowired 的理解
最近一直在写@autowired 一直很疑惑 这个注解不就是插入一个实例对象吗？和javascript的import xxx from ‘./’ 是基本相同的，但java语言和javascript不一样 对象class是需要实例的，使用这个注解主要还是能解决重复生成实例的问题...
2021-05-05 11:16:34
455
原创 promise all 的简易实现
function mypromise(fn) { this.cache = null; this.resolve = (value) => { this.data = value; this.cache(value); }; fn&&fn(this.resolve); } mypromise.prototype.then = function (func_onResolved) { this.cache = fu
2021-04-30 11:50:23
79
原创 react 和 vue的diff更新
两个树的完全 diff 算法的时间复杂度为 O(n^3) ，但是在前端中，我们很少会跨层级的移动元素，所以我们只需要比较同一层级的元素进行比较，这样就可以将算法的时间复杂度降低为 O(n)。算法首先会对新旧两棵树进行一个深度优先的遍历，这样每个节点都会有一个序号。在深度遍历的时候，每遍历到一个节点，我们就将这个节点和新的树中的节点进行比较，如果有差异，则将这个差异记录到一个对象中。在对列表元素进行对比的时候，由于 TagName 是重复的，所以我们不能使用这个来对比。我们需要给每一个子节点加上一个 ke
2021-03-16 23:20:02
137
原创 react和vue更新机制的差异
react是通过setState() 驱动数据 当前节点更新整个state 运用的技术是immutable 技术这immutable 翻译过来就是不可变的 ，就是说state的数据是不可变，如果要改变，就要通过重新生成一个不可变的数据来替换state（注意 ：是整个节点树，自顶而下的更新） 如果要避免不必要的更新 需要增加shouldComponentUpdate 这个周期函数里判断是否要更新 return false 就是不更新 组件式函数用的是useMemovue的更新原来是通过数据劫持来驱动更新，在
2021-02-24 11:35:29
737
原创 axios 取消请求小结
说白了就是每次请求生成一个令牌，如果要取消请求，直接调用这个请求即可，代码如下const urlCache=new Map()export default function CancelAxios(axios,config){ if(urlCache.has(config.url)){ urlCache.get(config.url).cancel("取消了"); urlCache.delete(config.url) } const sourc
2021-02-19 15:45:52
203
原创 前端自动打包和发布
最近版本迭代比较多，打包发布让我觉得有点烦，突然想到，为啥不做一个一键打包和发布呢？费话不多少，直接上代码首先安装 npm i publish-sftp -g然后在项目page.json同级目录下添加一个sftp.json文件，里面添加代码如下{ "localPath": "./dist",//打包后的路径 "remotePath": "/home/ylz/apache-tomcat-9.0.16/webapps/djg",//远程路径 "protectedRemotePath":
2021-01-27 15:29:45
533
原创 element 虚拟select
由于select组件如果里面的选择项过多，会造成卡顿，所以分装一个组件，支持大数据滚动，不卡顿，废话不多说 直接上代码，直接一个vue组件支持v-model绑定，用法 <VisualSelect v-model="值" :list="选择项" > </VisualSelect><template> <div :class="classId"> <el-select @visible-change="popChang
2021-01-20 21:05:11
1561
8
原创 最简单的promise代码，没有之一
最简单的promise代码，没有之一 function promise(fn) { this.cache = null; const resolve = (value) => { this.data = value; this.cache(value); }; fn(resolve); } promise.prototype.then = function (func_onResolved) { this.cache = func
2021-01-19 10:06:10
74
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人