- 博客(275)
- 问答 (2)
- 收藏
- 关注
RSS订阅原创 【bug】【vue+el-table】数据重绘,刷新数据（组件嵌套较深，数据结构包含children），页面未及时更新，已解决
这个bug应该不是组件嵌套过深的原因，而是新增的时候没有加children，组件的渲染依赖于特定的数据结构或状态，利用索引直接设置一个项，Vue 可能无法追踪它的变化。然后log打印父组件列表的数据，发现打印有值，但是页面上什么都不展示。父组件列表，用的是element文档上树形数据与懒加载示例的第一个。通过确定按钮，将勾选的list数组传到父组件，进行赋值操作。新的弹窗用来勾选数据回显到列表中，处理为当前项的子节点。弹窗中还有列表，通过弹窗中的新增按钮操作列表。列表页面，通过新增按钮打开弹窗。
2024-05-22 10:23:00
74
原创 【bug】vue-treeselect在el-form表单中可以正常显示，在el-table中显示的是空的，添加 :append-to-body=“true“可解决
加这个 :append-to-body="true"就可以了，应该是样式影响的原因，组件添加 :append-to-body=“true” 属性时，这个属性会让组件的挂载点变为文档的 元素，而不是它所在的父级元素，可以避免被遮挡，脱离原始的文档流。基本上就是一样的代码，但是在列表中就不显示。
2024-05-11 15:19:42
190
原创 【vue+vue-treeselect】根据指定字段，如isLeaf(是否末级节点)，设置只允许末级节点可以选
(2)获取数据源的时候，设置下禁用判断，vue-treeselect的禁用是isDisabled属性。（1） :flat="true"一定要设置。（3）isLeaf有值就要禁用。
2024-05-08 19:33:15
215
原创 审查元素时，hover等伪元素，只会在鼠标悬停在对应元素上时生效。一旦鼠标移开，样式就会消失，已解决
最近遇到个小小的问题通过控制台查看元素，只有在鼠标悬停在对应元素上时生效。一旦鼠标移开，样式就会消失即使我把右侧的这些都选上了也没用。
2024-04-11 14:23:12
503
原创 nuxt服务端渲染，用create-nuxt-app脚手架创建NuxtJS应用，报错 Cannot find module ‘node:util‘解决
因为node版本不匹配，我本地是14.5.0，我改成16.12.0，再重新npm run dev 项目可以正常运行。手动配置可以实现更多自己想要的，更自由一些。但是完整的实现非常复杂，官方建议使用nuxt，开箱即用。4、遇到报错： Cannot find module ‘node:util’vue文档中提到，可以直接通过配置，在vue的项目中准备 SSR 应用程序。安装成功，访问 http://localhost:3000/即可。2、使用nuxt创建项目。3、创建好之后运行项目。
2024-04-08 23:11:02
344
原创 【bug】j解决vue项目打包时的报错，Cannot find package ‘babel-plugin-transform-remove-console‘ imported from‘xx’已解决
vue项目打包时报的错首先，遇到报错一定别慌，一定别慌，一定别慌~~~~
2024-04-02 11:00:22
363
原创 【优化】在封装的组件中使用自定义指令，根据传入的参数判断是否执行自定义指令
一开始没有通过参数判断的时候，directives的bind我只写了el一个参数，然后发现传进来的变量不管true或false，都执行了自定义命令，这是因为我没有加第二个参数binging。例如，对于 v-my-directive，name 的值将是 “my-directive”。value (any): 指令的值，即在模板中 v-my-directive 后面括号内的值。oldValue (any): 如果正在更新的元素之前已经绑定了相同名称的指令，oldValue 将是上一个指令的值。
2024-03-27 19:44:57
432
原创 【vue项目中点击下载】弹窗提示：离开此网站？系统可能不会保存您所做的更改，改为直接下载，不提示此弹窗内容，已解决
【代码】【vue项目中点击下载】弹窗提示：离开此网站？系统可能不会保存您所做的更改，改为直接下载，不提示此弹窗内容，已解决。
2024-03-15 10:35:09
936
原创 web worker性能优化，vxe-table提高表格列拖拽和列宽改变等操作的性能，具体实现详解
数据是复制的，而不是共享的。worker.js 脚本文件需要被浏览器访问到，并且在主线程中通过 new Worker() 方法来创建一个新的 Worker 线程。2、Worker 是一个使用构造函数创建的对象（例如 Worker()），它运行一个具名 JavaScript 文件——该文件包含将在 worker 线程中运行的代码。3、可以在 worker 线程中运行任何你喜欢的代码，有一些例外：你不能直接在 worker 线程中操作 DOM 元素，或使用 window 对象中的某些方法和属性。
2024-02-23 10:28:52
869
原创 【vue2】vuex入门篇，彻底搞懂vuex
在工作中使用vuex，可能知道怎么用，但是没有仔细研究过，之前出过一篇【vuex存储保存数据、使用数据，超详细解说】，其实也没有把vuex说的很透彻，学习的过程就是先会用，能先应付开发，然后再抽出时间，慢慢搞懂它。本文不包含总结，共12553字数，共740行。年前开始写的，前后消磨了快一周才写完。新年里写的文章，所以祝看到此文的伙伴们，新的一年 ：一元复始,万象更新！！
2024-02-16 11:05:32
945
原创 【vue+vex-table】翻页保留复选框选中状态
在 reduce 方法的回调函数中，对于每个新的 item，先检查 obj 中是否有该 id 的键。如果没有，则将其添加到 prev 数组中，并在 obj 中设置该键的值为 1；如果有已选项 setCheckedRow，则遍历 listSource中的所有项，并检查是否有该项在已选数组中。将分页数据以key为1，值为数组的形式保存，比如当前分页是第一页selectedData：{1：records}，复选框事件中把当前页的存到对应的分页下，点击分页调列表接口时，再根据每一页的数组进行回显。
2024-02-06 18:03:12
1123
2
原创 【vue】配置代理解决跨域详细篇--Access to XMLHttpRequest at ’http:xx‘ from origin’http:xx‘has been blocked by CORS
而我们正常开发的时候，项目框架已经搭建好，前期的东西已经配置好，我们只要关注具体的业务，调接口联调即可假设项目刚创建好，需要联调接口，vue推荐使用axios，这里对于axios不过多解释，基本上大家都知道，是基于XMLHttpRequests进行了二次封装报错中出现CORS，NO‘Access-Control-Allow-Origin’header，这个就是因为跨域了假如我们的本地是http：localhost:8080http：协议名localhost：主机名8080：端口号。
2024-02-04 10:00:13
1209
原创 【vue】前后端不在同一网络下，前端解决跨域
/ 响应拦截器(res) => {// 调用完一个接口就进行-1}, 200);return res.data.list//可能从别处复制的时候是res.data.data，一定跟着后台返回的数据格式走},
2024-01-30 22:11:44
735
原创 【bug】在子组件中watch监听父组件传过来的值，监听不到，已解决
【代码】【bug】在子组件中watch监听父组件传过来的值，监听不到，已解决。
2024-01-30 11:04:24
820
原创 【react】创建react项目+项目结构
当看到webpack compiled successfully，代表项目创建好了，会自动打开浏览器展示带有Reack 标志的页面。
2024-01-19 11:07:59
576
原创 【react】基础知识点-初识react，示例+react所需的3个js库
基础知识点的学习—不使用react框架，以引入js库的形式，现学习最基本的内容。react-dom.js： 提供操作DOM的react扩展库。babel.min.js：解析JSX语法代码转为js代码的库。react.js： React核心库。
2024-01-16 23:03:22
402
原创 【vue+Swiper】vue中使用swiper缩略图，展示一张大图及n张小图，点击小图切换不同的大图展示，完整代码
效果：这是在swiper官网上找的示例，swiper太强大了，有非常多不同的示例,有api，有教程，还可以下载示例代码。但是第一次使用，研究这个缩略图的实现还是花了几个小时，好在实现了。安装将swiper封装成组件可以复用，在components公共组件文件夹中新增swiper文件夹，新增index.vue选择API文档，Thumbs（缩略图），可以查看缩略图的使用示例ps：这里要补充下，示例其实挺清楚的，但是因为没有对应的html参考，所以我在这里多花了一点时间。
2023-12-09 10:54:43
1428
原创 【vue】vue-slick-carousel插件，实现横向滚动列表手动左右滚动（也可设置为自动滚动）
在npm官网搜vue-slick-carousel，查看更详细的配置。1、VueSlickCarousel 一定要设width: 100%如果设置了箭头展示，而页面中没有左右箭头，可能是样式影响了。2、carouselOptions具体配置项。3、allFlowArr要展示的内容数组。
2023-12-03 19:12:56
1704
原创 【bug】vue create 项目名，bash: vue: command not found
2、笔记本可以直接在开始中搜：查看高级系统设置，点了立马跳转到对应位置，系统属性–环境变量—系统变量—选择path–选择编辑–新建，如果node存在c盘，例如：C:\Program Files\nodejs,然后保存。1：我的电脑–右击属性—系统属性–环境变量—系统变量—选择path–选择编辑–新建，如果node存在c盘，例如：C:\Program Files\nodejs,然后保存。创建项目的时候，报bash: vue: command not found。
2023-11-09 16:43:17
623
2
原创 uniapp项目启动时检查版本，版本过旧提示：更新至最新版本，App简单版实现思路详解
效果：实现的思路比较简单，后期需要优化的话，会持续更新uniapp文档上有提到关于版本更新在文档中搜uni.getUpdateManager()（小程序的更新），会提示app的更新需要点击连接，跳转到其他页面查看。**
2023-11-07 20:17:19
1305
原创 【uniapp+vue3/vue2】ksp-cropper高性能图片裁剪工具，详解
（2）点击确认按钮之后还是触发uni.chooseImage事件-----ksp-cropper不要包裹在有点击事件的标签中，单独放就行。（1）打开插件的时候没有占满整个页面—ksp-cropper不需要包裹在有类名的标签中，单独放就行。（2）点击确认按钮事件和点击取消按钮事件中，拿到临时路径和清空临时路径。（1）只要url有值就会显示插件，为空就会隐藏插件。
2023-11-07 14:10:50
523
原创 【uniapp+vue3】scroll-view实现纵向自动滚动及swiper实现纵向自动滚动
scroll-view本身不支持自动滚动，通过scroll-top属性控制滚动，但是不可以循环滚动。使用swiper组件实现很简单，封装下即可用，且支持衔接滑动。
2023-10-31 13:38:52
3262
原创 【vue3+ts】引入incopark图标，及动态组件componet渲染字体图标
如果需要在数组中循环使用且是有规律的使用，比如菜单导航栏，图标加文字的效果。2、动态组件component。1、iconpark官网地址。
2023-10-23 21:29:40
1054
原创 【uni-app+vue3】分享功能，App端调用手机的系统分享，可分享到微信、QQ、朋友圈等，已实现
【uni-app+vue3】分享功能，App端调用手机的系统分享，可分享到微信、QQ、朋友圈等，已实现
2023-10-20 17:49:01
1735
2
原创 【uniapp】自定义导航栏时，设置安全距离,适配不同机型+最顶部的状态栏修改字体颜色
【uniapp】自定义导航栏时，设置安全距离,适配不同机型。
2023-10-05 16:37:37
3841
原创 【typescript】面向对象（下篇），包含接口，属性的封装，泛型
假期第八篇，对于基础的知识点，我感觉自己还是很薄弱的。趁着假期，再去复习一遍：程序中所有的操作都需要通过对象来完成计算机程序的本质就是对现实事物的抽象，抽象的反义词是具体。比如照片是对一个具体的人的抽象，汽车模型是对具体汽车的抽象等。在程序中所有的对象被分成两个部分，数据和功能。以人为例，人的姓名，性别，年龄，身高，体重等属于数据，人可以走路，说话，吃饭，睡觉这些属于人的功能，数据在对象中被称为属性，而功能称之为方法。
2023-10-05 13:15:34
200
原创 【Typescript】面向对象（上篇），包含类，构造函数，继承，super，抽象类
假期第七篇，对于基础的知识点，我感觉自己还是很薄弱的。趁着假期，再去复习一遍：程序中所有的操作都需要通过对象来完成计算机程序的本质就是对现实事物的抽象，抽象的反义词是具体。比如照片是对一个具体的人的抽象，汽车模型是对具体汽车的抽象等。在程序中所有的对象被分成两个部分，数据和功能。以人为例，人的姓名，性别，年龄，身高，体重等属于数据，人可以走路，说话，吃饭，睡觉这些属于人的功能，数据在对象中被称为属性，而功能称之为方法面对对象，操作对象，就要先拥有对象，如何创建对象？
2023-10-04 23:29:43
243
原创 【vue3】shallowReactive与shallowRef；readonly与shallowReadonly；toRaw与markRaw
【vue3】shallowReactive与shallowRef;readonly与shallowReadonly；toRaw与markRaw详解
2023-10-02 23:50:19
826
原创 【vue3】Suspense组件和动态引入defineAsyncComponent的搭配使用
【vue3】Suspense组件和动态引入defineAsyncComponent的搭配使用
2023-10-02 00:05:37
383
antd-vue tab切换前根据情况判断是否允许切换
2022-01-07
echarts柱状图，点击柱体打开弹窗里还是柱状图，点击其他柱体，只切换弹窗中的数据
2021-10-09
TA创建的收藏夹 TA关注的收藏夹
TA关注的人