游客ruqdfvh2iuyqc_社区达人页

2023年02月

• 02.11 23:23:26
  发表了文章 2023-02-11 23:23:26

  2023年了，来试试前端格式化工具

  eslint 使用eslint的生态链来规范开发者对js/ts基本语法的规范。防止团队的成员乱写. 这里主要使用到的eslint的包有以下几个： 使用的以下语句来按照依赖： 接下来需要对eslint的

  

2023年01月

• 01.18 10:38:33
  发表了文章 2023-01-18 10:38:33

  unplugin-vue-components 不能识别组件的自动导入的类型 (pnpm)

  unplugin-vue-components 不能识别组件的自动导入的类型 (pnpm)

  
• 01.15 22:33:42
  发表了文章 2023-01-15 22:33:42

  js获取屏幕上圆和椭圆的点坐标

  js获取屏幕上圆和椭圆的点坐标

  
• 01.15 22:32:12
  发表了文章 2023-01-15 22:32:12

  CentOS8 安装MongoDB 本地连接

  MongoDB 是一个由 C++ 语言编写的基于分布式文件存储的数据库，MongoDB 是一个介于关系数据库和非关系数据库之间的产品，是非关系数据库当中功能最丰富，最像关系数据库的。常用用于物流场景-地理位置信息存储、社交场景-储存储用户信息、物联网场景-监控数据、日志记录等，MongoDB在这些场景的应用比其他数据库有这巨大优势。

  
• 01.15 22:23:28
  发表了文章 2023-01-15 22:23:28

  qgis 将县区的数据转成市区的边界数据

  在第一步的基础上，有了21个面，那么咱们可以对当前的面进行融合操作，生成一个面，也就是咱们需要的市区边界数据。

  
• 01.15 22:19:51
  发表了文章 2023-01-15 22:19:51

  cypress初探

  E2E测试会发现启动的方式很简单，那么对应的组件测试，也是一样的简单。这样就不演示了，等一下来编写对应的组件，来看看效果

  
• 01.15 22:10:50
  发表了文章 2023-01-15 22:10:50

  vue3源码分析——看看complier是怎么来解析的

  在astexplorer.net/ 这个网站上可以写上vue的模板，然后选择vue3-complier,就可以得到vue3编译模板后的ast了。

  
• 01.15 22:07:14
  发表了文章 2023-01-15 22:07:14

  vue3源码分析——解密nextTick的实现

  在上面的测试用例当中，对外抛出一个方法，方法内有一个循环，执行响应式数据count变化100次。在这个测试用例本身是可以通过的，但是打debugger就会发现，更新流程走了100次，并且dom操作也是走了100次。

  
• 01.15 22:02:22
  发表了文章 2023-01-15 22:02:22

  vue3源码分析——实现组件更新

  vue3在更新element的时候,除了需要分情况讨论更新children外,还需要来看vue3的属性有没有变化;那么同样的道理,对于组件的更新,也是需要来更新属性,插槽等

  
• 01.15 21:59:32
  发表了文章 2023-01-15 21:59:32

  vue3源码分析——手写diff算法

  通过上面的测试用例，可以看到是分了7种情况来的，在本篇文章，不采用编写测试用例，有兴趣的可以自己去github上面查看，这里主要使用图文加上代码，帮助大家更快的理解vue3中的diff算法

  
• 01.15 21:52:51
  发表了文章 2023-01-15 21:52:51

  vue3源码分析——实现element属性更新，child更新

  在上面流程图中，如果在setup中有一个对象obj,并且赋值为 ref({a:1})，然后通过某种方式重新赋值为2，就会触发更新流程；

  
• 01.15 21:47:24
  发表了文章 2023-01-15 21:47:24

  vue3源码分析——实现createRenderer，增加runtime-test

  createRenderer顾名思义就是创造一个render(可以直接导出一个render函数),现在咱们的是直接在render.ts中对外导render函数出提供给createApp中使用

  
• 01.15 21:36:58
  发表了文章 2023-01-15 21:36:58

  vue3源码分析——实现组件通信provide,inject

  问题解决： 问题1和问题2都很好解决，对外导出函数，传递对应的参数，只是数据存储在哪里的问题，经过仔细的思考，会发现，组件的数据是需要进行共享的，父组件存入的数据，里面的所有子组件和孙子组件都可以共享，那么存储在实例上，是不是一个不错的选择呢？ inject 是获取父级组件的数据，那么在实列上还需要传入parent
• 01.15 21:31:52
  发表了文章 2023-01-15 21:31:52

  vue3源码分析——实现slots

  使用slots的地方是this.slots，并且调用的属性是default,那么slots，并且调用的属性是default,那么slots则是一个对象，对象里面有插槽的名称，如果使用者没有传递，则可以通过default来进行访问。
• 01.15 21:27:10
  发表了文章 2023-01-15 21:27:10

  vue3源码分析——实现props,emit，事件处理等

  由于是测试dom,jest需要提前注入下面的内容，让document里面有app节点，下面测试用例类似在html中定义一个app节点哦
• 01.15 21:21:35
  发表了文章 2023-01-15 21:21:35

  vue3源码分析——实现组件的挂载流程

  在正文之前，希望您先看过本系列文章的 vue3 组件初始化流程，这里详细介绍了组件的初始化流程，这里主要是实现挂载

  
• 01.15 21:12:35
  发表了文章 2023-01-15 21:12:35

  vue3源码分析——rollup打包monorepo

  有了rollup,咋们是不是需要在打包的目录下面来搞个配置文件rollup.config.js，里面咋们写上入口，出口,打包的格式等

  
• 01.15 21:08:28
  发表了文章 2023-01-15 21:08:28

  手写vue3源码——ref, computed 等

  既然都需要使用 .value，是不是意味着，传入的数据都会被一个对象所包裹，基于这个特点，咋们是否可以使用class 里面有get, set 方法呢？class 本身是一个实例对象，刚好里面的get,set 可以对属性进行拦截存取行为

  
• 01.15 20:59:58
  发表了文章 2023-01-15 20:59:58

  手写vue3源码——readonly, isReactive,isReadonly, shallowReadonly

  经过上一节的内容，咋们一起学习了，reactive 是怎么实现的，回顾下，reactive 是返回了一个代理对象，通过proxy的第二个参数，传入 get, set, 当对象触发对象的get,set的时候，对依赖进行收集
• 01.15 20:55:35
  发表了文章 2023-01-15 20:55:35

  手写vue3源码——reactive, effect ,scheduler, stop 等

  在上面的测试用例中，有两个关键的函数reactive和effect,一个是创建响应式对象，另一个则是收集依赖，这个测试用例有点大，一次性实现不太方便，咋们可以把这任务拆分为更小的模块（任务拆分），分别写两个测试用例来测试reactive和effect

  
• 01.15 20:49:16
  发表了文章 2023-01-15 20:49:16

  手写vue3源码——创建项目

  在根目录下面新增 packages, 然后在里面分别建立 pkg1 和 pkg2， pkg1 和 pkg2 是单独的两个包，用两个包来方便测试，分别给两个包进行 init操作生成对应的package.json文件

  
• 01.15 20:43:33
  发表了文章 2023-01-15 20:43:33

  vue3组件更新流程

  还记得组件挂载阶段中的 setupRenderEffect么？ 在这里的时候会进行依赖收集，会在实例instance上挂载一个方法

  
• 01.15 20:31:55
  发表了文章 2023-01-15 20:31:55

  vue3 组件初始化流程（vue3 源码系列）

  在ensureRenderer 这个函数中,判断renderer是否存在，不存在则创建，并且传入一系列的api去初始化

  
• 01.15 20:21:54
  发表了文章 2023-01-15 20:21:54

  vue3 响应式数据库—— reactive

  总结下，咋们在模板中使用 ref,reactive等是vue本身在渲染的时候就会把整个组件放入ReactiveEffect中进行依赖收集，对外抛出一个run方法，run方法用于决定是否需要进行依赖收集哦,对于ref处理普通数据准备另开篇幅

  
• 01.15 20:17:56
  发表了文章 2023-01-15 20:17:56

  大文件处理（上传，下载）思考

  在计算文件hash的方式，主要有以下几种： 分片全量计算hash、抽样计算hash。在这两种方式上，分别又可以使用web-work和浏览器空闲（requestIdleCallback）来实现.

  
• 01.15 20:11:49
  发表了文章 2023-01-15 20:11:49

  unocss + vite + varlet 搭建移动端

  第二个特点是实现移动端物理键的控制，换句话说是这里实现了监听物理按钮的返回来做一点你想要的事情。

  
• 01.15 20:07:11
  发表了文章 2023-01-15 20:07:11

  vue3-ssr-webpack-vuex-vue-router 项目搭建过程分享

  在资源这里咋们可以看到store, router,components 等都会通过咋们的app.js(main.js)来分为两个入口，一个是服务端入口，另一个是客户端入口来通过webpack进行打包；

  
• 01.15 19:59:58
  发表了文章 2023-01-15 19:59:58

  vue2，vue3移动端实现表格固定和首列固定

  粘性布局，这个属性也可以实现行和列的固定，在pc端上没有啥问题，但是在手机端上会抖动。

  
• 01.15 19:57:31
  发表了文章 2023-01-15 19:57:31

  vue2 响应式原理保姆级别

  为了实现这一点，Observer把对象的每个属性通过Object.defineProperty转换为带有getter和setter的属性，这样一来，当访问或设置属性时，vue就有机会做一些别的事情。

  
• 01.15 19:52:18
  发表了文章 2023-01-15 19:52:18

  vue2 Vue3 v-model 原理

  这个子组件只是实现一个简单计数器的功能,然后我向上分发的事件名称是update:value。但是vue2如果使用v-model会自动的把这个事件名称给改成input。

  
• 01.15 19:47:48
  发表了文章 2023-01-15 19:47:48

  保姆级别Vue2组件通信(面试常问)

  如果父组件传递了一些属性到子组件，但子组件并没有声明这些属性，则它们称之为attribute，这些属性会直接附着在子组件的根元素上
• 01.15 19:39:35
  发表了文章 2023-01-15 19:39:35

  请你阐述一下对vue虚拟dom的理解

  在vue中，每一个组件其实都会被vue编译成一个vNode（虚拟dom）,每个组件都有一个render函数，每个render函数都会返回一个虚拟dom树，这也就意味着每个组件都对应一棵虚拟DOM树

  
• 01.15 19:37:00
  发表了文章 2023-01-15 19:37:00

  你知道mongoose中的 __v么

  mongoose 在添加数据的时候，会默认给你加上一个属性__v,这个属性的全称是__version,顾名思义是版本的意思，作用是给每一个文档加上版本控制，防止并发来修改数据库的数据。

  
• 01.15 19:34:16
  发表了文章 2023-01-15 19:34:16

  mongo 详解修改操作

  在mongo中的数组操作是不同的，会有专门的指令来进行修改.

  
• 01.15 19:27:59
  发表了文章 2023-01-15 19:27:59

  mongo 进阶之—— mongoose 认识

  不管是哪种代码的环境，如果需要连接数据库，都需要使用数据库的驱动。(以下代码的环境是node为例)。在node环境中，mongodb的驱动就叫做mongodb,但是这个驱动也有一个缺陷，模型的验证做的不是很好，一般我们都会使用mongoose 这个库来自定模型，验证参数等

  
• 01.15 19:25:41
  发表了文章 2023-01-15 19:25:41

  mongo 进阶之—— mongoose 基本操作

  有的人说，怎么老是成功的，应该需要些失败来看看mongoose的作用，那么咋们就来看看这个失败是怎么处理的

  
• 01.15 19:18:48
  发表了文章 2023-01-15 19:18:48

  mongo 进阶之——聚合管道

  上面这句话的意思是，先用pumber来进行分组，会有两个字段，一个是"_id"和"count",在后一个管道中用1表示显示，0表示不显示

  
• 01.15 19:12:08
  发表了文章 2023-01-15 19:12:08

  手把手写一个vue3的组件库，在指定dom中生成水印

  本次手把手记录的是一个vue3的给dom生成水印的指令，这里把他封装成一个组件，下一次直接拉下来就可以使用。这个可以用在移动端或者是pc端上防止数据被人截屏。效果如下：

  
• 01.15 19:08:30
  发表了文章 2023-01-15 19:08:30

  mongo 的基本操作

  这里可能有的人又会说，使用use xxx 确实切换了数据库，但是在show dbs 里面怎么看不到，这是因为mongo 给你创建了数据库，但是里面没有东西，等有东西的时候自动显示出来。

  
• 01.15 19:03:12
  发表了文章 2023-01-15 19:03:12

  mongo 的安装与基本的认识

  mongodb属于nosql中的文档型数据库，每个文档相当于是一个对象，它没有列的概念，也没有表关系

  
• 01.15 19:00:16
  发表了文章 2023-01-15 19:00:16

  若依V3 | RuoYi-Vue3-JS Doc

  个人比较喜欢vue3的开发方式，目前也是全职前端，使用vue来作为技术站开发。在这里使用若依，并没有打算抄袭人家的成果，只是偶然在gitee的评价中看到，官方目前没有打算使用Vue3来更新前端。

  
• 01.15 18:57:48
  发表了文章 2023-01-15 18:57:48

  使用vue-demi来开发一个vue2和vue3组件

  写这个包的主要目的是为了使用vue-demi来写vue2和vue3的公用组件。简单说一下自己的开发感受吧。不没有想象中的那么顺利（可能是自己没有理解到位）； 使用vue-demi 里面目前来说只能vue2和vue3选择一种来进行测试，如果你想在同一个项目中对vue2和vue3来切换测试，我没有做到，会有些问题。

  
• 01.15 18:53:54
  发表了文章 2023-01-15 18:53:54

  重温js—— 事件循环

  大家都知道，js是单线程的语言。为啥要设置成单线程的呢？ 不妨大家想一想，如果js是多线程的语言，一个线程来操作删除dom，一个线程来新增dom.那么这两个谁能先完成？结果就会变得不可控制。但是这里有的人肯定会说，html5提出了workers可以来启动多线程。没错，workers是可以用于启动多线程，在worker线程中你可以运行任何你喜欢的代码，不过有一些例外情况。比如：在worker内，不能直接操作DOM节点，也不能使用window对象的默认方法和属性，这也是存在一些弊端的（本质上也还是单线程）。

  
• 01.15 18:50:46
  发表了文章 2023-01-15 18:50:46

  重温js——作用域和作用域链

  js代码执行，会在call stack创建对应的作用域（执行上下文），然后每一个上下文中会有一个VO来保存当前作用域的变量. 但是VO中如果会创建函数，那么函数中有一个额外的属[[scoped]]会指向栈中最顶层的VO（AO）;

  
• 01.15 18:48:28
  发表了文章 2023-01-15 18:48:28

  重温js——执行上下文

  在函数的那一张中，提到了全局环境和局部环境的概念，就是说在函数的执行过程中，函数内部的环境和外面是独立的，只是说函数内部可以使用外面全局环境的变量或者在调用全局函数的方法。在此，来总结一下js的执行环境。

  
• 01.15 18:44:55
  发表了文章 2023-01-15 18:44:55

  重温js——属性描述符

  我们会发现，当我们去改变属性赋值的时候，会自动执行set函数，相当于是通知了set函数。属性取值的时候会自动的执行get函数，自动通知get函数。正是因为有这个自动通知的功能，vue2中的响应式系统就是基于Object.defineProperty()来实现对象的响应的。

  
• 01.15 18:41:33
  发表了文章 2023-01-15 18:41:33

  重温js——原型和原型链

  我们在前文说到,所有的对象都是通过new 函数来创建的,所有的函数也都是对象 . 那么问题来了,Function也是一个函数,那么他是怎么来的呢?(这个问题是不是类似有点像先有鸡和先有蛋的感觉)但是Function函数是在js引擎启动的时候,就直接把Function放入到内存中的.

  
• 01.15 18:38:34
  发表了文章 2023-01-15 18:38:34

  重温js—— 错误处理

  上面的代码中，我们定义了一个变量，然后当中函数的方法来调用，最后输出一个结果。但是运行期间却报错了，并且下面的代码也是没有执行的，原因是代码报错了会阻止程序的运行。我们大家都知道js的解释性语言，代码解释一句然后执行一句，所以后面的代码是不能够直接执行的。

  
• 01.15 18:34:02
  发表了文章 2023-01-15 18:34:02

  重温js——正则表达式

  正则表达式是一种规则，在语法上各个语言都是一样的，有点是通用性很高，缺点是在平常开发中使用的频率并不是很高，主要使用的范围在用于判断字符串里面的规则。

  
• 01.15 18:29:30
  发表了文章 2023-01-15 18:29:30

  重温js——构造函数基础

  在上面的代码中，我们可以创建多个对象，使用函数的方式来创建的对象。（但是这两个对象是不一样的，每一次都创建一个新的对象）可以方便许多，除了上面的方法外，还有一种构造函数的方式来创建对象。