- 博客(118)
- 收藏
- 关注
RSS订阅原创 理解JavaScript事件循环机制
JavaScript是单线程的，这意味着它一次只能执行一段代码。然而，前端开发中需要处理各种异步任务，例如处理用户输入、发起网络请求、执行定时器等。为了应对这些异步任务，JavaScript引入了事件循环机制。事件循环是一种机制，用于管理和调度异步任务的执行。它允许JavaScript在等待异步任务完成的同时继续执行其他代码，从而保持了用户界面的响应性。
2023-12-13 14:02:06
177
原创 Vue 项目中使用 Pinia 状态管理详细教程
Pinia 是一个用于状态管理的现代 Vue 3 库，它提供了强大的工具来管理 Vue 应用程序的状态。进行状态管理的基本步骤。你可以根据项目的需要扩展状态管理器以支持更多的状态和操作，以实现复杂的状态管理。钩子将管理你的状态，而你可以在任何需要访问状态的组件中导入并使用它。状态将在整个应用中保持同步。这是一个简单的示例，但你可以根据你的项目需求扩展状态管理器并添加更多状态和操作。的官方文档以获取更多高级用法和示例。实例并将其添加到应用中。应用中，你需要创建一个。钩子来访问和修改状态。
2023-12-13 09:36:11
558
原创 React拖拽实践
当涉及到中的用户体验时，拖拽功能是一个常见而重要的需求。在React中，实现拖拽功能可以通过多种方式完成，但通常需要深刻理解React的状态管理、事件处理和DOM操作。本文将探讨React中拖拽的实践，包括基本原理、拖拽库的使用、性能优化和一些实际示例。
2023-12-08 17:07:24
485
原创 React查询、搜索类功能的实现
查询之类的如果是通过向列表接口中发送对应参数来查询的，那么在默认输出时，在useEffect钩子中的请求中可以先为需要查询的请求参数设初始的state，也就是null或者未定义，这样的话初始请求的还是整个列表，然后将这些state放入useEffect的依赖中，也就是第二个参数的数组中，然后在一些查询相关的组件中，如下拉选项、Search搜索框、时间选择器等，具体根据可查询项决定，然后更新初始设置的state，set为在这些组件的事件函数中将组件筛选的最终值。
2023-12-08 17:00:17
334
原创 对于React的了解与认识
React是由Facebook开发的JavaScript库，旨在构建可维护的用户界面。它采用了虚拟DOM的概念，通过比较虚拟DOM树的变化来高效更新真实DOM，从而提高性能。React是一个功能强大的前端开发工具，拥有丰富的生态系统和庞大的社区支持。深入理解React的核心概念、组件化开发、状态管理和性能优化是成为一名卓越的前端工程师的关键。希望这篇文章能帮助您更好地掌握React，并在实际项目中发挥其潜力。如果您有任何问题或想要深入了解React的某个方面，请随时留言。
2023-12-07 14:14:47
293
原创 React富文本编辑器wangEditor
（2）updateHTML作为用于富文本编辑器的值发生变化后向父组件暴漏出来的当前最新的值，父组件使用高阶函数来获取编辑器最新的值。（1）传递的一个dufaultHTML作为富文本编辑器的默认值，供编辑的场景使用。
2023-12-07 14:01:25
1261
原创 rgba、十六进制颜色是什么？如何这两个表达白色、黑色、红色、绿色、蓝色？
RGBA是一种颜色表示方式，它表示红、绿、蓝和透明度（Alpha）通道的值。每个通道的取值范围是0到255，而透明度通道的取值范围是0.0到1.0。这种表示方式允许开发人员指定颜色的精确度和透明度，常用于网页开发和图形设计中。十六进制颜色是另一种常见的颜色表示方式，它使用十六进制数来表示红、绿、蓝三个通道的值。每个通道的取值范围是00到FF，其中00表示最小值（0），而FF表示最大值（255）。在HTML和CSS中经常使用这种表示方式来指定颜色。
2023-12-06 14:13:24
616
原创 CSS外边距重叠：原理、结果
外边距重叠是指当两个或多个相邻的元素具有相同的外边距方向时，它们的外边距会合并成一个较大的外边距。具体来说，当上一个元素的下外边距与下一个元素的上外边距相遇时，它们会合并成一个外边距，这就是外边距重叠。当上一个元素的下外边距和下一个元素的上外边距相等时，它们的外边距将会抵消，结果是其中一个元素的外边距消失了。当父元素的外边距和子元素的外边距重叠时，父元素将会继承子元素的外边距值，这可能会对整体布局产生影响。当两个相邻元素的外边距重叠时，它们的外边距将合并成一个较大的外边距。
2023-12-06 14:10:07
186
原创 vue 的实例生命周期
Vue.js 的实例生命周期指的是 Vue 实例在创建、更新和销毁过程中的一系列事件和钩子函数，允许在不同阶段执行自定义操作。
2023-12-01 09:43:01
157
原创 vuex的讲解与相关用法
Vuex是一个非常有用的工具。它允许我们在Vue应用程序中集中管理和跟踪状态，并提供了一种可预测的方式来处理数据流。包括state（状态）、mutations（突变）、actions（动作）和getters（获取器）。下面我将分别对这些概念进行解释：State（状态）：存储应用程序中的所有状态数据。它可以被认为是应用程序的单一数据源。在Vuex中，通过创建一个包含各种属性的JavaScript对象来定义state。Mutations（突变）：Mutations用于更改state中的数据。
2023-12-01 09:23:24
642
原创 微信小程序如何分包管理
微信小程序的分包管理可以帮助你更有效地组织和管理小程序的代码和资源，以提高性能和加载速度。了解分包的概念： 首先，了解微信小程序中分包的概念。分包是将小程序的代码和资源分成不同的包，可以按需加载，从而减少初始加载时间和减轻主包的负担。配置 app.json 文件： 在小程序的 app.json 文件中进行分包配置。你可以在这里定义哪些页面属于主包，哪些属于分包，并指定每个分包的路径。按需加载： 当用户访问分包页面时，小程序会自动下载并加载分包的代码和资源。不需要手动处理加载逻辑。
2023-12-01 09:05:43
459
原创 深入了解JavaScript中的AJAX和HTTP请求
AJAX是一种利用JavaScript和HTTP请求与服务器进行异步通信的技术。传统的浏览器请求页面会刷新整个页面，而AJAX允许在不刷新页面的情况下发送请求并更新页面的部分内容。
2023-12-01 09:00:12
290
原创 JavaScript 中松散类型的理解
在这个例子中，变量 b 存储的是一个字符串类型的值 "10"，变量 c 存储的是一个数字类型的值 5。当将这两个变量相加时，JavaScript 首先将变量 c 转换为字符串，然后将两个字符串连接起来，得到的结果是一个字符串 "105"，而不是数字 15。在某些情况下，变量可能会隐式地进行类型转换，这可能会导致出乎意料的结果。因此，在编写 JavaScript 代码时，我们需要时刻注意变量的类型及其可能发生的转换，以避免出现意外的错误。例如，可以使用同一个变量存储数字、字符串或对象等不同的。
2023-12-01 08:49:22
34
原创 JavaScript中Object.prototype.toString.call()、instanceOf和Array.isArray()的区别
Object.prototype.toString.call() 该方法返回一个表示对象类型的字符串。可以使用这个方法来判断一个值的类型。
2023-11-29 16:02:22
349
原创 uniapp链接WebSocket 常用的API
WebSocket是一种在单个TCP连接上进行全双工通信的协议，它可以在客户端和服务器之间建立持久性的连接，并允许双向通信。在UniApp中，你可以使用WebSocket来实现实时消息推送、实时聊天等功能。要使用WebSocket，在UniApp中你需要调用相关的API来创建WebSocket连接，并处理相关的消息事件。通过WebSocket，你可以实现更加即时和高效的通信，为你的应用增加更多的实时交互体验。
2023-11-29 14:22:48
693
原创 Map循环注意事项
给每个生成的元素添加唯一的key属性： 在使用map()方法生成组件列表时，为了帮助React准确地识别和更新每个组件，需要为每个生成的元素（组件）添加一个唯一的key属性。避免在组件内部进行复杂的逻辑或副作用操作： 尽量避免在map()方法的回调函数中编写过多的复杂逻辑、网络请求或其他副作用操作。注意map()方法的返回类型： map()方法对原始数组进行遍历并生成一个新的数组。这可能会导致不可预测的结果。注意循环中的条件判断： 在map()方法的回调函数中，避免进行复杂的条件判断或过度依赖外部变量。
2023-11-25 14:09:44
236
原创 怎么快速熟悉模板
如果该模板或框架官方提供了文档，那么阅读文档是最好的开始。官方文档通常会介绍模板的使用方法、基本组件，以及一些重要的配置参数等信息。通过仔细阅读官方文档，可以更快速地掌握该框架或模板的使用方法和核心特性。
2023-11-24 15:30:17
53
原创 JavaScript中的短路表达式
但需要注意的是，一些复杂的逻辑可能会被短路表达式所掩盖，从而产生意想不到的结果。当使用逻辑与运算符时，如果第一个操作数是假值（例如false、null、undefined、空字符串或0），整个表达式将返回这个假值。否则，如果第一个操作数是真值，整个表达式将返回第二个操作数。运算符时，如果第一个操作数是真值，则整个表达式将返回这个真值。否则，如果第一个操作数是假值，整个表达式将返回第二个操作数。例如，下面代码中如果name为真值（非空字符串），则返回name的值；
2023-11-24 15:21:57
117
原创 JS中Cookie的基本使用
是一种在Web浏览器中存储和检索用户信息的机制。它允许网站在用户计算机上存储小型数据片段，以便在之后的会话中使用这些数据。Cookie通常用于持久化用户首选项、跟踪用户行为和提供个性化体验。通过JavaScript，您可以使用document.cookie属性来访问和操作Cookie。document.cookie返回一个字符串，其中包含当前页面可用的所有Cookie。您可以将新的Cookie添加到该字符串中，或编辑/删除现有的Cookie。
2023-11-21 14:52:00
242
原创 new Vue() 发生了什么
new Vue()是创建Vue实例的入口，它触发了Vue应用的初始化、数据绑定和视图更新等重要过程。Vue实例是Vue应用的根组件，它管理应用的状态和行为，与其他Vue实例通信，实现组件化开发。Vue的数据绑定和响应系统使开发者能够轻松地构建动态且高效的用户界面。Vue的选项合并和模板编译等机制使开发者能够以更简洁和高效的方式构建应用。
2023-11-21 10:53:31
111
原创 对本地存储的有效期的理解
本地存储是一种在Web开发中常用的客户端存储数据的方式，它可以让网页应用程序在用户的浏览器中存储和检索数据，而无需依赖服务器来保存信息。本地存储的有效期是指数据存储在用户的设备上可以被访问和保留的时间段。在本地存储中，有两种主要的机制来控制数据的有效期：持久性本地存储和会话性本地存储。
2023-11-16 15:16:52
422
原创 虚拟DOM的原理和理解
通过在内存中进行计算并只更新真实DOM中变化的部分，它避免了昂贵的DOM操作，从而提高了应用的响应速度。当数据发生变化时，而不是直接修改真实的DOM，而是创建一个新的虚拟DOM树，然后将其与前一个虚拟DOM树进行对比，找出差异，并将这些差异应用到真实的DOM上。为了解决这个问题，Virtual DOM（虚拟DOM）被引入为一个中间层，允许开发者在内存中进行操作，从而避免频繁且不必要的真实DOM操作，提高性能。创建一个虚拟DOM的副本：当数据发生变化时，创建一个新的虚拟DOM树来代表页面的更新状态。
2023-11-16 15:09:18
77
原创 vue、react中虚拟的dom
Vue使用虚拟DOM来更新DOM树，以消除不必要的DOM更新。在上面的例子中，Vue将创建一个虚拟DOM表示，它与实际DOM完全一样，可以在代码中进行操作。当用户输入时，Vue将计算出要在实际DOM中更新的差异，并将其应用于实际DOM。当用户与应用程序交互时，React将重新计算整个应用程序树，以确定哪些节点应更新，然后将其更新到DOM中。这种方法的问题在于，当你不断交互时，计算所有的差异变得非常昂贵。React创建了一个虚拟Dom表示，它与实际DOM完全一样，可以在代码中进行操作。
2023-11-15 16:14:32
76
原创 微信小程序中复制文本
上述代码中，通过调用wx.setClipboardData()方法，传入要复制的。中，可以使用wx.setClipboardData()方法来实现复制。，成功复制后会弹出一个Toast提示框显示"复制成功"。
2023-11-15 15:35:28
1030
原创 微信小程序内部跳到外部小程序
通过以上步骤，就可以在微信小程序中实现跳转到外部小程序的功能了。当用户点击相应的按钮或触发事件时，将会打开目标外部小程序，跳转到外部小程序需要确保目标小程序已经在微信开放平台上发布并获得审核通过。同时，跳转到的外部小程序与当前小程序存在合作关系，具体关联关系可以参考微信开放文档中的相关说明。），您可以通过设置 envVersion 参数来指定要跳转的目标小程序版本。默认值为 'release'，即跳转到正式版。要在微信小程序中跳转到外部小程序，您可以使用微信小程序提供的。如果目标小程序有多个版本（如。
2023-11-14 09:59:29
325
原创 uniapp实现时间选择器
在<uni-datetine-picker>标签时 confm 事件监听用户洗择的时间。在事件外理都中，可以获到用户洗择的时间对象，并进行相应操作。具体的配置选项可以查阅Uniapp官方文档中uni-datetime-picker组件的相关说明。组件提供了丰富的配置选项，可以根据需求进行自定义。fields: 设置时间选择器展示的时间字段，如年、月、日、时、分等。运行项目，即可在页面中看到时间选择器，并能够选择时间。start: 设置时间选择器的起始时间。end: 设置时间选择器的结束时间。
2023-11-14 09:53:52
1892
原创 WebSocket: 实时通信的理解与认识
通过建立持久连接，并使用双向通信进行实时数据传输，WebSocket优化了实时通信的性能和效率。相比于传统的HTTP请求，WebSocket提供了更低的延迟和更高的吞吐量，使得实时数据的交换成为可能。实时数据展示：对于需要实时更新的数据展示，如股票行情、天气预报等，WebSocket提供了高效的数据传输机制。游戏开发：对于在线游戏或多人游戏，WebSocket提供了快速且实时的通信方式，使得玩家能够实时互动和竞技。使用WebSocket对象的onopen事件处理程序，在连接建立时执行所需的操作。
2023-11-03 21:52:08
716
原创 react 生命周期讲解
默认情况下，React会重新渲染所有的组件。它接收组件的属性和状态作为参数，并且返回一个对象来更新状态，或者返回null表示不需要更新。它接收组件的属性和状态作为参数，并且返回一个对象来更新状态，或者返回null表示不需要更新。当涉及到React组件的创建、更新和销毁过程时，React的生命周期方法起到了至关重要的作用。正确地理解和使用这些生命周期方法可以帮助我们在不同的阶段执行特定的操作，从而实现更好的组件控制和优化。render(): render方法根据最新的状态和属性渲染组件的UI。
2023-11-03 21:46:58
329
原创 vue和react的区别
Vue 使用双向绑定的方式来实现数据的响应式，它通过监听对象属性的 getter 和 setter 方法，使得当数据发生变化时，视图中对应的地方就会自动更新。而 React 则使用的是单向数据流，通过父组件传递 props 给子组件，子组件无法直接修改 props，需要通过调用父组件传递的方法来修改。Vue 使用 Vuex 管理组件之间共享的状态，Vuex 将所有组件的状态集中管理，可以进行集中控制，方便进行状态管理。Vue 的插件和组件较为丰富，生态圈相对完善，中文文档较多，便于入门和学习。
2023-11-03 21:43:33
478
1
原创 Vue3 项目中怎么使用 jsx——易懂
在vue3项目中使用）可以让你更灵活地创建组件和视图。接下来给大家讲解一下vue3项目中怎么使用如果你还没有Vue 3项目，可以使用Vue CLI来创建一个。在创建项目时，确保选择Vue 3选项。接下来，进入项目目录并启动开发服务器。为了在Vue 3项目中使用JSX，你需要安装@vue/babel-plugin-jsx插件。这个插件允许你在Vue 组件中使用JSX语法。为了启用JSX，你需要配置Babel。在项目根目录下，创建一个.babelrc文件，如果没有的话，来配置Babel插件。
2023-11-02 08:05:14
1090
1
原创 react高阶成分（HOC）例子效果
在这个示例中，withAuthentication 是一个高阶组件，它接受一个函数式组件 WrappedComponent 作为参数，并返回一个新的函数式组件 WithAuthentication。最后，我们在应用中使用了 AuthenticatedComponent，它是通过高阶组件 withAuthentication 包装过的 MyComponent，从而添加了身份验证功能。这是一个适用于React函数式组件的高阶组件示例，可以帮助你在函数式组件中实现类似的功能封装和复用。
2023-10-27 13:51:42
512
1
原创 前端面试基础题——12
Vuex 是一个专为 Vue.js 应用程序开发的状态管理插件。它采用集中式存储管理应用的所有组件的状态，而更改状态的唯一方法是提交mutation，例为mutations属性中定义的方法。2.为什么浏览器不能读取 JSX？浏览器只能解决 JavaScript 对象，而不能读取惯例 JavaScript 对象中的 JSX。所以为了使浏览器可能读取 JSX，首先，须要用像 Babel 这样的 JSX 转换器将 JSX 文件转换为 JavaScript 对象，而后再将其传给浏览器。
2023-10-26 18:02:53
239
原创 js字母大小写转化——两种方式
toUpperCase() 方法将调用该方法的字符串转为大写的形式进行返回。toLowerCase() 方法将调用该方法的。转为小写的形式进行返回。
2023-10-26 15:00:08
1041
原创 vue项目切换页面白屏的解决方案
中，template下是必须有一个根元素的，vue3变为可多个根元素。<Transition>中的组件呈现不能动画化的非元素根节点。1、页面切换后白屏，同时切换回上一个页面同样白屏。也就是说，组件内必须有一个根元素。
2023-10-25 21:06:12
759
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人