- 博客(271)
- 资源 (1)
- 收藏
- 关注
RSS订阅
原创 vue中组件的props属性（详）
今天这篇文章，让你彻底学会props属性……props主要用于组件的传值，他的工作就是为了接收外面传过来的数据，与data、el、ref是一个级别的配置项。
2021-10-28 11:20:54
169851
51
原创 《愿你》-- 送给来访博主的每一位小伙伴
❤️愿你拥有好运气。对一切充满感激，喜欢美好，也喜欢自己。❤️愿你有盔甲也有软肋。善良得有原则，感性得有底线。对可恶的，就该连本带利地还击，凶狠之后别失礼仪。❤️愿你不饶点滴，不饶自己。❤️愿你一生努力，一生被爱。在糟糕的日子里和注定的人撞个满怀。❤️愿你付出甘之如饴，所得归于欢喜。有人说你不甘平庸，其实你只是想遇见那个更好的自己，只是别忘了偶尔停下来，就当犒劳那努力的自己。❤️愿你道路漫长，有的是时间发生故事。若没有人陪你颠沛流离，便以梦为马，随处可栖。因为是你，到的地方一定温暖为..
2020-12-15 14:38:32
422
3
原创 elementUI表格实现可编辑和增加行功能--直接复制即可
结构： <div class="twoTable fuceng"> <div class="h_top"> <span>新建任务</span> <img src="../../../../static/img/close.png" alt="" @click="close_twoTableDelete"> </div> <div cla
2020-07-16 17:24:37
10669
2
原创 vue中使用antvG6画分组结构图及树形关系图
效果图：<div id="container" ></div>我是对G6中提供的该图的相关函数进行了封装--下面的代码是写在公共js文件里面：export function renderMap(data,graph){ const collapseIcon = (x, y, r) => { return [ ['M', x - r, y], ['a', r, r, 0, 1, 0, r..
2020-06-24 11:51:11
7258
原创 使用antV-G6在angualr中画树形关系图
使用antV-G6在angualr中画树形关系图（流量追踪图）公司有个需求就是既要呈现出每个节点之间的关系（图里面需要带箭头，为了表现出流向关系），又要排版呈现出树状结构，也就是说是具备层次关系的，这种图呢就相当于既不完全是树图，形状呢又不是关系图，我算是苦思冥想了。而且又是在angualr中，angualr中支持的第三方插件特别少，本来想采用echarts的树状图，但是发现，树图的每个节点...
2020-04-30 15:31:41
6035
10
原创 vue3中使用antv-S2表格（基础功能版）
表格的数值默认会渲染排序 icon, 可以配置 showDefaultHeaderActionIcon关闭。当配置为对象时，always 控制是否在子维度不足 2 个时始终展示小计，默认不展示。首先创建一个vue3+vite+ts项目，可以查看下面相关文章，只看第一条即可。可以调整行宽、列宽、列排序、单个单元格详情展示、选中某列、某行等基本功能。可以通过上面设置的SUM函数自动计算出数值，也可以自定义累加函数。配置自定义方法优先级大于配置聚合方式，即配置。1、在项目中安装（npm/pnpm都可以）
2024-04-10 18:04:10
612
原创 解决vue3中刷新浏览器页面的axios请求状态变为canceled
为什么会想到fetch呢，是因为最近在开发中要加一个悲观锁的功能，具体需求是：用户1和用户2不能同时打开一个模型进行编辑，用户1优先进入模型后，要对该模型进行上锁，关闭该模型或刷新页面时要进行解锁，此时在刷新页面时出现了问题。由此可得出原因：页面刷新后，页面已经被销毁，但放在mounted中的解锁异步请求还没完成，页面就会主动把未完成的请求取消掉，这时的请求是还没到服务器的。在后台使用 Fetch API，因此它同样具有 64 KB 的载荷限制，以及它还可以确保请求在页面卸载后继续发出。
2024-03-21 16:33:01
467
2
原创 vue3中使用vuedraggable实现拖拽el-tree数据进分组
vue3中使用vuedraggable拖拽el-tree数据，可以实现单个拖拽、双击添加、按住ctrl键实现多个添加，或者按住shift键实现范围添加，添加到框中的数据，还能拖拽排序
2024-02-22 11:46:36
671
原创 微信小程序跳转第三方网站链接
很简单，先定义一个跳转外网的页面，利用 web-view 标签，通过src设置你要跳转的外网地址。然后在你的跳转按钮写跳转函数即可。
2024-01-24 15:35:29
760
原创 elementPlus下拉框实现自定义模糊查询且100%匹配的优先展示
里面只需要修改对应的参数即可。100%匹配的同样会优先展示。创建人就会显示在创建时间。创建时间在创建人之上。
2024-01-16 14:27:52
552
原创 vue3中实现el-tree通过ctrl或shift批量选择节点并高亮展示
按住ctrl键实现单个多选 按住shift实现区间范围多选。2、通过循环节点数组来更新nodes节点中isCurrent属性，控制高亮。引入的hooks文件，index.ts。1、重点是要获取当前所选节点数组。
2023-12-08 16:12:28
974
原创 vue3中使用antv-X6实现关系图
代码如下，里面有个useMouse()函数，追踪鼠标位置，这个需要项目中安装vueuse，可以查看下面文章去自行安装，这里使用的X6中自定义节点的方式实现的，项目目录如下，hooks里面存放一些函数和变量。nodes里面是自定义节点的页面，最外围的index.vue就是主渲染页面。这个是自定义节点页面，定义好之后，在主页面中进行引入。有问题的可以评论区讨论~
2023-12-06 15:04:11
1229
原创 用echarts在vue2中实现3d饼图
1、修改3d饼图大小，在大概244行的位置，grid3D的对象里面，修改distance属性，即可调整。在3d饼图中设置下面这两属性是没用的，所以这里请注意一下，记得去grid3D里面修改他的位置。4、修改饼图位置，这个常用，也是在grid3D这个属性里面设置，在大概240行的位置。3、修改3d饼图颜色，直接在data中的optionData里面修改就行了。2、修改3d饼图视角高度，在大概161行的位置，修改函数的第二个参数。二、在main.js中引入。直接复制粘贴吧，省事。
2023-10-20 17:08:54
4707
5
原创 Argument of type ‘string | null‘ is not assignable to parameter of type ‘string‘. Type ‘null‘ is n
sessionStorage.getItem("detail") 方法可能返回null , 而null 不是字符串 ， 则JSON.parse在执行时就会出错，所以typescript 提示了上面的错误信息，即要处理为null 的情况。
2023-10-19 14:35:42
974
原创 【three.js】坐标辅助器和轨道控制器
结合上一篇基本的3d页面代码，我们在里面添加坐标辅助器，也就是x y z轴坐标系，这样可以更直观的查看物体的位置。现在我们设置的立方体是自动旋转的，如果我们不想让他自己旋转，想手动拖拽，如何实现呢？查看效果，z轴不显示是因为，z轴是正对我们脸部，从我们正面看就是一个点。其实就是可以让拖拽或者放大缩小的行为不那么生硬，可以使其慢慢停止下来。看效果 ，用鼠标拖动并松开鼠标时，会慢慢停止，而不是立马停止。为了让z轴显示出来，我们修改相机的位置。效果，可以自动旋转，也可拖拽。这时就用到了轨道控制器。
2023-10-09 14:33:35
490
原创 【three.js】结合vue进行开发第一个3d页面
如果我们想要不断的渲染，让它动起来，看到它不同方位的形状，需要调用渲染函数，如下所示。效果：由于我们设置的是从z轴看这个正方体，因此正对z轴看到的是平面。此时就完成了在vue中开发的一个简单的3d页面。回车后，依次输入项目名，选择vue和Js开发。新建一个项目目录，在集成终端打开，输入。将上面的静态渲染改为下面的旋转动画渲染。接下来我们开始安装three。然后安装依赖并运行项目。
2023-10-09 11:36:27
1940
原创 【three.js】简介和本地部署
实现企业网站三维呈现，让企业形象更直观、更立体地展现给客户，打破传统平面展示模式，打造智慧、个性、创新的企业形象。因此我们可以访问b站大佬在国内搭建好的本地three.js官网，大家访问如下链接即可，当然也可以自己搭建，下面有讲解。什么是点、线、面、几何体、材质、物体、场景、相机、渲染器、动画、控制器等基础概念，搞定一个最基础的场景和3d物体的显示。接着3d渲染要真实性，肯定离不开PBR，详细了解什么是PBR，PBR基于物理的光照原理的渲染,。由于访问three.js官网是国外的网站，非常慢。
2023-10-08 11:33:13
2373
原创 去除angular中blob图片显示报unsafe的错误提示
由于在angular项目中，浏览器在显示blob图片的时候，自动识别该地址为unsafe，导致图片加载不出来。在ts文件中添加以下代码。
2023-10-07 16:53:17
179
原创 vue2中使用wangEditor（JS引入）
说是下载，其实是把这个链接放入浏览器地址栏，回车出现的代码，一键复制，粘贴到项目中你新建的文件里面、、、为了防止内网无法使用，咱不用cdn引入，直接下载js放入本地使用。wangeditor及css和js文件夹自己创建即可。本文讲的不是npm安装，是下载js本地引入哦~可以放入自己的静态资源文件夹下。
2023-08-29 10:36:06
1043
原创 解决vue3+ts+vite中启动报错No known conditions for “./lib/locale/lang/zh-cn“ entry in “element-plus“ package
【代码】解决vue3+ts+vite中启动报错No known conditions for "./lib/locale/lang/zh-cn" entry in "element-plus" package。
2023-08-08 11:20:04
7917
2
原创 vue3+ts+elementui-plus二次封装树形表格实现不同层级展开收起的功能
我只定义了三层数据，就只演示展开了三层，还可以多层，自己设置即可。
2023-07-27 16:53:59
1689
原创 vue中预览pdf
如果后端返回的pdf地址，粘贴到浏览器的url框中，可以在浏览器中直接进行预览的，那么我们就用window.open，或 a标签，或iframe标签通过设置src进行预览即可。可以直接使用window.open（'获取到的pdf地址'）重新打开一个浏览器页签。通过浏览器页签直接实现预览功能（预览页面的样式，根据浏览器的不同，会略有差异），这种情况，上述方法解决不了，需要使用插件或者设置浏览器请求头的方式来解决。后端返回了服务器文件pdf的地址，粘贴到浏览器的url框中，单页pdf可以直接使用。
2023-07-18 16:34:37
14492
7
原创 vue3中如何使用mock--看完必会
当项目前后端同时开发，后端来不及提供接口时，前端可通过mock来模拟后端返回数据，非强制性使用 ，详情参考。随机生成一个布尔值，值为 true 的概率是 1/2，值为 false 的概率同样是 1/2。// 这种默认调用mockJS.Random的image的第一种方法。Mock.Random 是一个工具类，用于生成各种随机数据。只是在属性值字符串中占个位置，并不出现在最终的属性值中。，取其返回值作为最终的属性值，函数的上下文为属性。占位符引用的是 Mock.Random 中的方法。
2023-06-29 16:12:05
918
原创 解决vue3+vite项目中引入mockjs失败的问题--无法找到模块“mockjs”的声明文件
看到上面报错，根据提示 修改声明方式 declare module 'mockjs'我们修改一下引入的声明，发现修改之后仍然报错；需要在vite-env.d.ts文件中，添加。然后就可以正常使用了。
2023-06-28 17:20:02
1003
原创 【react全家桶学习】react的 (新/旧) 生命周期（重点）
相对比vue的生命周期，react显得复杂的多，光从名称上就比vue长，所以做好准备，不要放弃，坚持就是胜利、
2023-06-27 17:50:04
4163
4
原创 Typescript 之接口 interface（详解）
你可以把它理解为形状，一个对象需要有什么样的属性，函数需要什么参数或返回什么样的值，数组应该是什么样子的，一个类和继承类需要符合什么样的描述等等。需要注意的是类 Interface 只会检查实例的属性，静态属性是需要额外定义一个 Interface；接口就是用来定义一个类结构，定义一个类中应该包含哪些属性和方法，同时接口也可以当成类型声明去使用。混合类型的接口就是使用同一个 Interface 来描述函数或者对象的属性或方法。接口可以约束对象,函数,类的结构和类型,是一种代码协作必须遵守的契约。
2023-06-21 10:46:48
4955
2
原创 如何在 Vue3 组件中使用 TS 类型（必看）
（vue2中我们是通过给子组件设置ref属性，然后通过this.$refs.xxx.methods()来实现的），那这里如何实现呢？如何在 vue3 组件中使用 TS 类型的讲解就到此结束啦，有写的不对的地方，欢迎评论区指出哦~就会有提示，因此，建议显式地为事件处理函数的参数标注类型。注意：子组件的ref值应该和下面定义的值保持一致，如：modalRef。有时我们可能想为 ref 内的值指定一个更复杂的类型，可以通过使用。方式二：通过泛型参数来定义 props 的类型，这种方式更加直接。
2023-06-16 21:16:01
2496
原创 小红书前端开发面试题（温故而知新）
在实现过程中，可以通过在前端计算文件哈希值或MD5值的方式，避免上传重复的文件，减少服务器的压力，提高文件上传的效率。在以后的学习中，我们不仅要学会在实战中运用，更要在面试的时候将自己的知识技能流畅的表达出来，所以面试时候的语言组织和回答的条理性也是很重要的， 以后我会经常更新一些好的面试题，方便大家学习~then()：指定 Promise 成功(resolve)和失败(reject)时的回调函数，接受两个参数，一个是成功时的回调函数，一个是失败时的回调函数。使用插件可以提高开发效率，减少代码量。
2023-06-15 21:33:51
1356
1
原创 如何创建一个vite+vue3+ts项目（小白必看）
当修改代码时，HMR 能够在不刷新页面的情况下，把页面中发生变化的模块，替换成新的模块，同时不影响其他模块的正常运作。在我们使用 node 方法（比如 path.resolve）时提供 ts 类型声明，否则编辑器会报错，虽然不影响代码运行，但是会有红线很影响心情，如下图所示。Pinia 支持热更新，所以你可以编辑你的 store，并直接在你的应用中与它们互动，而不需要重新加载页面，允许你保持当前的。（2）写好页面之后，我们来创建路由，在 src 路径下新建 router/index.ts。
2023-06-15 16:06:05
1507
3
原创 小米秋招笔试题（强化基础）
D 选项和C 选项的区别是对-进行了转译,在集合里面-符号只有在作为区间的连接符(a-z,0-9)使用时才是元字符,在集合中直接使用就是-字符本身,\-等价于-,D选项正确。1、已知const arr = ['A', 'B', 'C', 'D', 'E', 'F', 'G']，下面可以获取数组最后一项的表达式有。解析：栈区存的是基本数据类型的变量和值，而引用数据类型存放在栈区的是变量和引用地址，它的值放在堆中。7-应用层、6-表示层、5-会话层、4-传输层、3-网络层、2-数据链路层、1-物理层。
2023-06-12 17:20:19
2203
原创 vue3【抛弃vuex，使用pinia】
Store(如 Pinia) 是一个保存状态和业务逻的实体，它不绑定到您的组件树，换句话说，它。Pinia 从使用角度和之前的 Vuex 几乎是一样的。反而比vuex更简单了。，它有点像一个始终存在的组件，每个人都可以读取和写入。
2023-05-16 18:05:41
2054
4
原创 vue3【父子组件间的传值--setup语法糖】
vue2.x使用的是 this.$emit 而vue3使用的是emit（因为vue3中没有this），它们的传值一样都是方法加值，即vue2.x的是。3、在子组件要触发的方法中，调用emits并传入发射给父组件的方法以及参数。this.$emit('方法名','传递的值(根据需要传或者不传)')导出，父组件才能访问到数据，否则拿不到子组件的数据。并定义要发射给父组件的方法，也可以传空。语法糖中，需要将组件的属性及方法通过。，vue3的setup语法糖的是。可以访问子组件的方法和属性，在。
2023-05-15 15:07:25
1831
vue打包为exe程序的demo包，全都配置好了，里面有详细使用流程
2021-05-31
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人