阿Der-CSDN博客

原创 Vue3 + TypeScript —— echarts中国地图绘制、散点、涟漪特效

Vue3 + ts使用echart完成中国地图绘制，散点、涟漪特效介绍、自定义地区名称映射

2023-11-01 17:11:45 1980

原创 Uniapp —— app编译调试

uniapp中的app调试，写习惯`web`项目、`H5`项目、还是说小程序朋友，都清楚各类的调试方式。`F12`检查，微信开发者工具的操作台等，都有现成好用的调试办法。但是在`uniapp`转译`app`后调试则变得十分困难，对于`app`中使用到的`nvue`文件对`css`样式有特殊要求，调试更是显得重中之重。

2023-08-14 18:08:44 3094 2

原创 Vue3中的computed、watch和watchEffect的区别

先前已经写过Vue3中watch和的文章，可以看这里，该篇文章主要聊聊computed特性以及这三者之间的区别。computed相信大家都不陌生，只是Vue中出现了watch和等侦听器，这三者大多数情景下相同结果的使用体验，使得我们模糊了这三者之前的作用区别。computed又称作，先给段官方描述 ⬇接受一个 getter 函数，。该 ref 通过 .value 暴露 getter 函数的返回值。它也可以接受一个带有 get 和 set 函数的对象来创建一个可写的 ref 对象。computed。

2023-06-25 21:04:55 702

原创 Vue3中的watch和watchEffect（知识脉络）

最近面试，问到`watch`和`watchEffect`的区别，在学习Vue3的路上知道了解过，但是自己的项目用的少或是没有运用到，对`watch`和`watchEffect`感受不够深刻，答不上来（真是菜！），写篇文章研究探讨一下。

2023-06-23 20:58:47 7394 2

原创 JS中的 Symbol 数据类型（简单理解）

JS中的`Symbol`是在ES6中出现的一种新的数据类型，它属于原始数据类型，平时对它的使用场景也是一知半解，现在有时间写篇文章，了解学习一下。

2023-06-22 17:06:46 253 1

原创原型链Object.prototype的proto属性指向显示异常

书接上回，我们发现打印展开后的Object.prototype的__proto__属性不为null，显然不符合常理。本文包含个人的推测及对上述问题的解释。挖到的坑在这里， ➡。

2023-06-17 16:08:44 253

原创 JavaScript中的原型和原型链

其实从图解关系的第一幅图可以发现，除了null，每个实例，每个原型对象，每个函数都有一个__proto__隐式原型属性，它总是指向一个原型对象prototype，就像文章开头说的一个个__proto__将原型对象串联起来，就是一条原型链。__proto__是由构造函数创建出来的对象的属性，除了null，每个实例，每个原型对象，每个函数都有一个__proto__隐式原型属性，这也侧面说明，每个实例，每个原型对象，每个函数都不是凭空出现的无中生有的。举个例子，看图一Object函数__proto__

2023-06-16 18:05:48 124 1

原创 JavaScript中的四种常见排序方式

本文将讲述，如sort排序、冒泡排序、选择排序、快速排序。尽量以通俗的话术帮助各位对 js 中的排序方式有所了解。

2023-06-15 14:37:06 936 1

原创 Vue3报错Extraneous non-props attributes (xxx) were passed to component but could not be ...

今天在重构项目时遇到一个报错，趁有时间整理学习理解一下。首先的话这不是什么特别严重的报错。赶时间的朋友可以直接滑到最下面看解决办法。

2023-06-09 20:50:39 24308 1

原创 Vue3报错Property “xxx“ was accessed during render but is not defined on instance.

的原因。

2023-06-08 15:24:39 41670

原创 Vue3中setup语法糖下的常见生命周期钩子——onMounted和onBeforeMount

在setup语法糖下的onMounted和钩子函数主要区别就是是否能获取到html文档中的DOM实例，与Vue2.x时大同小异。个人感觉Vue3中的setup语法糖写法上更能让人明显感受到一个组件从实例创建到实例创建完成是经过了一条”生产线“，生产线由Vue官方团队提供，而其中提供的钩子函数则是交给用户自主定义，写Vue2.x的时候感悟还没那么深啊。附一个官方链接组合式API下的生命周期钩子文章有问题之处还望评论斧正！更多其他组合式API生命周期钩子文章链接放在下方⬇敬请期待！

2023-06-06 17:44:48 9136

原创 Vue3组件间通信知识整理——父组件调用子组件方法

setup语法糖写法下组件是默认私有的，不同于选项式API和普通setup写法只要获取到相应的实例就可以完全访问到实例中的属性方法。而就是setup语法糖写法中将特定属性、方法显式暴露的宏指令。只有在子组件通过显式暴露的属性、方法才能被父组件通过ref获取并使用。需要注意必须写在声明好的属性、方法之下，否则会报错！文章有问题之处还望评论斧正！更多其他组件间通信文章链接放在下方⬇Vue3组件间通信知识整理——父组件向子组件传参Vue3组件间通信知识整理——子组件向父组件传参。

2023-06-05 15:41:22 2040 1

原创 Vue3组件间通信知识整理——父组件向子组件传参

Vue3的setup语法糖父组件向子组件传参就如上述。在Vue3中，refreactive等待响应式处理的api很容易会让人在声明定义一个变量的时候无脑地加上ref()、·reactive()等去将一个变量变为响应式。无脑地进行响应式声明会徒增计算量，浪费浏览器性能，所以要注意一般固定不变，无需响应式处理的数据就不要加上响应式处理了。我也是在书写本文的时候意识到这一问题。文章有问题之处还望评论斧正！更多其他组件间通信文章链接放在下方⬇Vue3组件间通信知识整理——子组件向父组件传参。

2023-06-05 15:40:11 632 1

原创 Vue3组件间通信知识整理——兄弟组件之间通信

按我的理解，我觉得无论是eventBus还是mitt它们都是一种订阅发布模式，也就是说这种通信方式是相对无敌的。不单单只是兄弟组件通信，你可以在任何组件emit订阅事件行为，在任何组件on发布事件行为，实现父子通信、父子孙通信等等。但是这种通信方式也是有弊端的，订阅发布模式的实现是一个闭包，统一管理着一个事件对象，如果项目中过度依赖这种通信方式，里面的事件对象就会变得十分之大，长期占用内存。

2023-06-05 15:39:24 2315 1

原创 Vue3组件间通信知识整理——子组件向父组件传参

子组件向父组件传参的方法还是比较多的，在不是setup语法糖的写法下，又是略有不同，在重构项目时最常用的就是第一种传值方法，毕竟这是组合式API代替选项式最通用子传父的写法。对于第二、三种方法，我个人是比较少用的，父传子值用，如果传递的是一个回调函数，会不会容易混淆，导致代码可读性降低呢？使用provide和inject会不会有点大材小用呢？对吧，总之考虑专用性方面还是推荐第一种方法吧。文章有问题之处还望评论斧正！更多其他组件间通信文章链接放在下方⬇Vue3组件间通信知识整理——父组件向子组件传参。

2023-06-05 15:39:06 7244 1

原创 elementPlus自动按需导入图标

可以看到需要两个依赖包，npm下载一下，这里就开始有坑了......直接给解决办法。最近在使用Vue3重构自己的项目，需要用到elementPlus里面的图标，vite中已经配置了elementPlus中的。，看看图标引入的相关文档，没道理为了图标又全局引入elementPlus吧！然后坑就又来了.....按官方的直接使用下述代码就能引入了。当你第一次正确自动按需引入图标时，你可以看到你的命令行是有反应的，它里面还需要引入另一个包。然后是vite.config.js 的配置，按官方来的就好了。

2023-05-24 12:39:24 3238 10

DM_Cxx的博客