- 博客(81)
- 收藏
- 关注
RSS订阅
原创 vue组件间通信
1.一种组件间通信的方式，适用于：子组件 ===> 父组件2.使用场景：A是父组件，B是子组件，B想给A传数据，那么就要在A中给B绑定自定义事件（事件的回调在A中）。第一种方式，在父组件中： 或 第二种方式，在父组件中：......mounted(){// 若想让自定义事件只能触发一次，可以使用once修饰符，或$once方法。
2023-08-17 16:10:16
287
28
原创 蓝桥杯复习笔记
原型链，所有的原型构成了一个链条，这个链条我们称之为原型链（prototype chain)。这个时候经历了什么呢？JS引擎线从Obj.address里寻找，发现没有找到，然后接着去找obj.__ proto __ 里面寻找，发现还是没找到，所以结果为undefined。我们可以给obj.__ proto __ 赋值。
2024-04-10 16:21:08
685
原创 React懒加载
React.lazy 函数能让你像渲染常规组件一样处理动态引入（的组件）。(1) 为什么代码要分割当你的程序越来越大，代码量越来越多。一个页面上堆积了很多功能，也许有些功能很可能都用不到，但是一样下载加载到页面上，所以这里面肯定有优化空间。就如图片懒加载的理论。(2) 实现原理当 Webpack 解析到该语法时，它会自动地开始进行代码分割(Code Splitting)，分割成一个文件，当使用到这个文件的时候会这段代码才会被异步加载。(3) 解决方案。
2024-03-17 08:43:36
334
原创 Portal
Portals 提供了一个最好的在父组件包含的DOM结构层级外的DOM节点渲染组件的方法。第一个参数child是可渲染的react子项，比如元素，字符串或者片段等。第二个参数container是一个DOM元素。
2024-03-17 08:43:11
366
原创 styled-components
通过JavaScript来为CSS赋能，我们能达到常规CSS所不好处理的逻辑复杂、函数方法、复用、避免干扰。样式书写将直接依附在JSX上面，HTML、CSS、JS三者再次内聚。它是通过JavaScript改变CSS编写方式的解决方案之一，从根本上解决常规CSS编写的一些弊端。**一定要写className **
2024-03-16 08:50:11
409
原创 Immutable
每次修改一个 Immutable 对象时都会创建一个新的不可变的对象，在新对象上操作并不会影响到原对象的数据。那么，这个属于深拷贝还是浅拷贝。
2024-03-15 08:47:09
386
原创 React路由
路由是根据不同的 url 地址展示不同的内容或页面。一个针对React而设计的路由解决方案、可以友好的帮你解决React components 到URl之间的同步映射关系注：exact 精确匹配 (Redirect 即使使用了exact, 外面还要嵌套Switch 来用)a new entry will not be added to the history stack,这个警告只有在hash 模式会出现。
2024-03-13 23:56:34
684
原创 React hooks
通过自定义 Hook，可以将组件逻辑提取到可重用的函数中，在 Hook 特性之前，React 中有两种流行的方式来共享组件之间的状态逻辑：render props和高阶组件，但此类解决方案会导致组件树的层级冗余等问题。而自定义Hook 的使用可以很好的解决此类问题创建自定义 Hook自定义 Hook 是一个函数，其名称以 “use” 开头，函数内部可以调用其他的 Hook。});}, []);使用return (
2024-03-13 23:56:14
911
1
原创 React生命周期
调用 forceUpdate() 将致使组件调用 render() 方法，此操作会跳过该组件的 shouldComponentUpdate()。通常你应该避免使用 forceUpdate()，尽量在 render() 中使用 this.props 和 this.state。通过这个钩子修改的state，state任何时候都取决于props，其他的函数无法进行修改。在新的生命周期中，废弃了旧版本的3个带will的钩子，新提出了2个钩子。第一次的初始化组件以及后续的更新过程中(包括自身状态更新以及父传子) ，
2024-03-12 15:27:50
1251
原创 js深拷贝
多个监听函数可以订阅同一个事件，当触发该事件时，所有订阅该事件的监听函数都会被执行，并传入相应的参数。“events” 对象中不存在该事件名称的属性，则创建一个空数组，并将监听函数添加到数组中；是特殊类型的对象，直接通过构造函数创建一个新的实例，并将 target 作为参数传入，完成特殊对象的深拷贝。“Function”、“Date”、“RegExp”、“Map” 或 “Set”，则说明 target。在构造函数中，我们初始化一个空对象 “events”，用于存储事件和对应的监听函数。
2024-03-12 15:27:02
350
原创 浅拷贝,简单深拷贝
如果 target 的类型不是对象或为 null，则直接返回 target，因为不需要进行拷贝。然后，我们根据 target 的类型创建一个空的克隆对象 cloneTarget。在这段代码中，我们定义了 _sampleDeepClone 函数，它接受一个参数 target，表示要进行简单深拷贝的目标对象。在这段代码中，我们定义了 _shallowClone 函数，它接受一个参数 target，表示要进行浅拷贝的目标对象。首先，我们根据 target 的类型创建一个空的副本对象 copy。
2024-03-11 16:20:38
409
原创 手写Object.create(),call函数,bind函数
在这段代码中，我们将原始函数存储在 that 变量中，然后返回一个新的函数。这个新函数在调用时将使用 apply 方法来调用原始函数，将 target 作为 this 值，并将预先传入的参数 args 与实际调用时传入的参数 innerArgs 进行合并。该函数的目的是在给定的对象 obj 上调用当前函数，并传递参数 args。在函数内部，首先将当前函数（即调用 _call 的函数）作为 obj 对象的属性 fn。语法调用 obj 对象的 fn 属性，并将参数 args 传递给该函数。最后，返回调用结果。
2024-03-11 16:19:55
506
原创 全排列，手写reduce
这段代码是一个递归函数 _permute，用于生成字符串参数的所有排列组合。它使用了回溯法的思想。首先，如果字符串的长度为 1，表示已经无法再进行排列，直接返回包含该字符串的数组 [string]。否则，创建一个空数组 res，然后对字符串中的每个字符 s 进行遍历。在每次遍历中，生成一个新的数组 arr，其中排除当前字符s。接着，递归调用 _permute 函数，传入 arr.join(‘’) 作为新的字符串参数，获取其排列组合结果。
2024-03-10 11:04:53
359
原创 事件委托,数组去重
6.如果 obj.hasOwnProperty(typeof item + item) 返回 false，表示 obj 对象不包含当前元素，说明当前元素是新的，那么将其添加到 obj 对象中，并在 filter() 方法中返回 true，表示保留当前元素。5.如果 obj.hasOwnProperty(typeof item + item) 返回 true，表示 obj 对象已经包含了当前元素，说明当前元素是重复的，那么在 filter() 方法中返回 false，表示过滤掉当前元素。
2024-03-10 11:04:34
964
原创 React基础
没有 state 的组件叫无状态组件（stateless component），设置了 state 的叫做有状态组件（stateful component）。props 的主要作用是让使用该组件的父组件可以传入参数来配置该组件。props是正常是外部传入的，组件内部也可以通过一些方式来初始化的设置，属性不能被组件自己更改，但是你可以通过父组件主动重新渲染的方式来传入新的。setState 是异步的，所以想要获取到最新的state，没有办法获取，就有了第二个参数，这是一个可选的回调函数。
2024-03-09 08:51:59
1643
8
原创 vue项目打包
脚手架开发后的代码不能参与上线，要将代码进行打包，才能上线。打包是什么？将多个文件压缩合并成一个文件语法降级less sass ts 语法解析, 解析成css。
2024-03-09 08:50:54
363
原创 【vue2项目总结】——mixins 复用
多个页面需要一个功能时，用mixins进行复用，使代码更简洁。1 新建一个 mixin 文件。3 页面中调用 混入的方法。2 页面中导入，混入方法。
2024-03-08 08:19:02
389
原创 【vue2项目总结】——相关功能
点击搜索，或者下面搜索历史按钮，都要进行搜索历史记录更新 (去重，新搜索的内容置顶)2 页面中接收参数, 调用接口，获取数据。请求拦截器中，统一携带 token。3 基于请求时携带参数发请求渲染。注册点击事件，点击时唤起弹窗。封装通用 API 接口。1 跳转时，传递查询参数。2 计算属性处理参数。
2024-03-08 08:18:09
365
原创 【vue2项目总结】—— vuex相关
1.封装 getters：商品总数 / 选中的商品列表 / 选中的商品总数 / 选中的商品总价。1.新建 vuex user 模块 store/modules/user.js。3.封装 action 和 mutation。2.vuex user 模块持久化处理。5.页面中 dispatch 调用。4.页面中 commit 调用。2.挂载到 store 上面。2.挂载到 vuex 上。1.全选 getters。2.点击小选，修改状态。3.点击全选，重置状态。1.将数据映射到页面。
2024-03-07 15:28:55
378
原创 【vue2项目总结】——动态渲染
3.页面中基于 goodsName 发送请求，动态渲染。1.计算属性，基于query 解析路由参数。2.根据不同的情况，设置输入框的值。3 搜索页，基于分类 ID 请求。
2024-03-07 15:27:41
413
原创 【vue2项目总结】——接口配置
在登录的组件中，data里存着需要用到的数据，方便使用生命周期钩子，页面未渲染前就获得后端数据定义方法，用异步实现双向绑定，相当于input+value。
2024-03-06 18:16:05
525
原创 【vue2项目总结】——路由配置
但凡是单个页面，独立展示的，都是一级路由。配置路由出口, 配置 tabbar。配置一级路由，新建对应的页面文件。redirect重定向到主页。2.准备对应的组件文件。
2024-03-05 17:44:58
348
原创 【vue2项目总结】——vant-ui的使用
把引入组件的步骤抽离到单独的js文件中比如。项目根目录， 新建postcss的配置文件。main.js中进行导入。
2024-03-05 17:44:36
499
原创 vue3（二）
shallowRef：只处理基本数据类型的响应式, 不进行对象的响应式处理。shallowReactive：只处理对象最外层属性的响应式（浅响应式）。作用：创建一个自定义的 ref，并对其依赖项跟踪和更新触发进行显式控制。等待异步组件时渲染一些额外内容，让应用有更好的用户体验。keyCode作为 v-on 的修饰符，同时也不再支持。Vue 2.x 有许多全局 API 和配置。data选项应始终被声明为一个函数。选项来提供数据，后代组件有一个。选项来开始使用这些数据。移动到指定位置的技术。
2023-12-09 18:42:14
105
2
原创 蓝桥第一期模拟总结
默认情况下，sort()会按照升序重新排列数组元素，即最小的值在前面，最大的值在后面。：ref 定义数据（包括对象）时，都会变成 RefImpl(Ref 引用对象) 类的实例，无论是修改还是重新赋值都会调用 setter，都会经过 reactive 方法处理为响应式对象。如果重新赋值，就会丢失原来响应式对象的引用地址，变成一个新的引用地址，这个新的引用地。fill-mode：规定当动画不播放时（当动画完成时，或当动画有一个延迟未开始播放时），要应用到元素的样式。本题涉及的业务主要是对象的处理。
2023-12-02 17:23:54
142
1
原创 node fs模板及蓝桥案例实战
fs 全称为 file system ，称之为 文件系统 ，是 Node.js 中的 内置模块 ，可以对计算机中的磁盘进行操作。主要操作有：1.文件写入2.文件读取3.文件移动与重命名4.文件删除5.文件夹操作6.查看资源状态。
2023-11-25 16:13:52
273
1
原创 ajax，axios，fetch
并不是所有的用户请求都提交给服务器。所以这里就和 Ajax 又很大不同了，一个是思想，一个是真实存在的 API，不过它们都是用来给网络请求服务的，我们一起来看看利用 Fetch 实现网络请求。416——请求中包含Range请求头字段，在当前请求资源范围内没有range指示值，请求也不包含If-Range请求头字段。417——服务器不满足请求Expect头字段指定的期望值，如果是代理服务器，可能是下一级服务器不能满足请求。Fetch 是一个 API，它是真实存在的，它是基于 promise 的。
2023-11-18 21:20:32
1014
原创 413 (Payload Too Large) 2023最新版解决方法
vue2脚手架2.在根目录下创建一个名为 vue.config.js 的文件（如果已存在，请打开该文件）。4.将 http://backend-server-url 替换为你实际的后端服务器地址。这样一个错误，查遍所有csdn，都没有找到解决方法，通过一些方式，终于解决了。博主在用vue脚手架开发的时候，在上传文件的接口中碰到。5.保存 vue.config.js 文件。最后博主成功解决，这个项目用的是。1.打开Vue项目的根目录。6.重新启动开发服务器。
2023-11-03 19:24:48
1492
原创 正则表达式
例如，我们希望从下面的输入字符串 $4.44 和 $10.88 中获得所有以 $ 字符开头的数字，我们将使用以下的正则表达式 (?一般来说 ^ 表示一个字符串的开头，但它用在一个方括号的开头的时候，它表示这个字符集是否定的。例如，表达式[^c]ar 匹配一个后面跟着ar的除了c的任意字符。方法并且匹配成功了，那么这些方法将返回一个数组并且更新相关的正则表达式对象的属性和预定义的正则表达式对象（详见下）。.是元字符中最简单的例子。例如表达式c.+t 匹配以首字母c开头以t结尾，中间跟着至少一个字符的字符串。
2023-10-19 11:39:09
586
5
原创 js题解（四）
给定一个构造函数 constructor，请完成 alterObjects 方法，将 constructor 的所有实例的 greeting 属性指向给定的 greeting 变量。给定字符串 str，检查其是否包含数字，包含返回 true，否则返回 false。给定字符串 str，检查其是否符合如下格式。2、其中 X 为 Number 类型。
2023-10-14 09:44:45
116
原创 js题解（三）
3、对象存在一个 sayIt 方法，该方法返回的字符串为 greeting属性值 + ', ’ + name属性值。1、返回一个函数 a，a 的 length 属性值为 1（即显式声明 a 接收一个参数）2、调用 a 之后，返回一个函数 b, b 的 length 属性值为 1。3、调用 b 之后，返回一个函数 c, c 的 length 属性值为 1。求 a 和 b 相乘的值，a 和 b 可能是小数，需要注意结果的精度问题。5、fn 的参数依次为函数 a, b, c 的调用参数。
2023-10-03 13:05:14
222
1
原创 ES11,ES12,ES13
Promise.allSettled() 方法返回一个在所有给定的 promise 都已经 fulfilled 或 rejected 后的 promise ，并带有一个对象数组，每个对象表示对应的 promise 结果。标准用法的 import 导入的模块是静态的，会使所有被导入的模块，在加载时就被编译（无法做到按需编译，降低首页加载速度）。在一般情况下，对象的引用是强引用的，这意味着只要持有对象的引用，它就不会被垃圾回收。否则返回左侧的操作数。的左侧 为 ’ '或者为 0 的时候，依然会返回左侧的值；
2023-09-28 10:38:57
69
原创 ES9,ES10
Generator 函数返回一个同步遍历器，异步 Generator 函数的作用，是返回一个异步遍历器对象。在语法上，异步 Generator 函数就是async函数与 Generator 函数的结合。JS正则表达式可以返回一个匹配的对象, 一个包含匹配字符串的类数组, 比如: 以 YYYY-MM-DD的格式解析日期，为Symbol对象添加了只读属性 description ，该对象返回包含Symbol描述的字符串。这样的代码可读性很差, 并且在改变正则表达式的结构的时候很有可能就会改变匹配对象的索引。
2023-09-22 10:14:36
62
原创 ES7,ES8
末尾逗号』在添加新的参数、属性、元素时是有用的，你可以直接新加一行而不必给上一行再补充一个逗号，这样使版本控制工具的修改记录也更加整洁。如果仅仅查找数据是否在数组中，建议使用includes，如果是查找数据的索引位置，建议使用indexOf更好一些。命令后面是一个 Promise 对象，返回该对象的结果。如果不是 Promise 对象，就直接返回对应的值。padStart()、padEnd()方法可以使得字符串达到固定长度，有两个参数，字符串目标长度和填充内容。
2023-09-21 10:31:57
53
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人