- 博客(149)
- 收藏
- 关注
RSS订阅原创 微信小程序之获取用户头像与昵称
"chooseAvatar" ,获取昵称最关键的是 type="nickname" ,大家多加注意哦！这个是通过一个点击事件进行显示的,下面是效果图,获取头像最关键的是 open-
2025-04-03 08:56:07
125
原创 HTTP请求状态码
HTTP 状态码由三个十进制数字组成，第一个十进制数字定义了状态码的类型。当浏览者访问一个网页时，浏览者的浏览器会向网页所在服务器发出请求。当浏览器接收并显示网页前，此网页所在的服务器会返回一个包含 HTTP 状态码的信息头（server header）用以响应浏览器的请求。HTTP 状态码的英文为 HTTP Status Code。301 - 资源（网页等）被永久转移到其它URL。404 - 请求的资源（网页等）不存在。500 - 内部服务器错误。200 - 请求成功。
2025-02-20 21:53:39
243
原创 使用vue3框架vue-next-admin导出表格excel（带图片）
选中导出需要结合列表中的复选框，给复选框绑定onchange事件，声明变量，把选中的数据存到到变量中，然后给导出的数据换成变量，就可以只导出选中的列表。onBatchExport方法中数据的key值要与data中保持一致，否则数据无法获取到，打印出的结果就回为undefined。安装命令：npm install js-table2excel。并且：当列表中的某一行内容只有数字时，导出的表格会默认转成缩写格式。全部导出：我还获取了当前的日期，导出时是名字＋导出的日期。
2025-02-20 18:05:51
552
原创 使用vue3框架vue-next-admin导出列表数据
utils.book_append_sheet(workbook, worksheet, 'Sheet1') 将工作表添加到工作簿。如果需要更精细控制（如自定义 Blob），可以使用 write 方法生成二进制数据，再结合 file-saver 保存。utils.json_to_sheet(data) 将 JSON 数据转换为 Excel 工作表格式。还可以只导出当前页的数据，可以根据分页进行数据划分。注释：我导出的数据为列表的全部数据（datum）；这个方法图片导出是url的路径，不是当前的图片。
2025-02-19 17:02:17
416
原创 vue使用百度富文本编辑器
npmaddvue-ueditor-wrap或者pnpmaddvue-ueditor-wrap进行安装。5、给富文本封装到components文件夹中新建富文本文件夹-UEditor.vue文件夹。安装依赖npmivue-ueditor-wrap@3.x-S。整理好的：vue-ueditor:百度编辑器JSP版。serverUrl修改成自己的富文本编辑的接口即可。4、main.js配置，引入富文本插件。因为官方的我没用来，所以我自己找的另外的包。
2025-01-18 17:17:47
528
原创 使用vue-next-admin框架后台修改动态路由
总的来说，VueNextAdmin是一个功能强大、灵活、易于扩展的后台管理框架，适合用来开发现代化的后台管理系统。route.ts这个是路由文件，不管是后端还是前端控制，只要是需要出现的页面，都需要在这个页面进行注册。而修改isRequestRoutes的文件在src/stores/themeConfig文件夹中。今天我们要使用vue-next-admin框架通过后端动态的修改路由。现在，后端动态路由修改完成。frontEnd.ts是前端控制路由的文件。现在我们就可以后端的控制路由。
2025-01-18 17:02:18
1228
原创 vue从0开始的项目搭建(含环境配置)
2.替换npm下载源:npmconfigsetregistryhttps://registry.npmmirror.com。1.下载node.js:Node.js—在任何地方运行JavaScript(nodejs.org)2.查看版本:windows+r输入cmd进入输入node-v命令查看版本号是否出现确认是否安装。7.在min.js页面内容替换（导入路由+删除引入的css+router挂载）（里面创建index.js），创建views文件夹（创建index页面）
2024-12-25 23:11:04
956
原创 vuex怎么防止数据刷新丢失？
综上所述，处理Vuex数据刷新丢失的问题，可以根据项目需求和技术栈选择合适的方法。Vuex提供了插件机制，可以编写插件来监听状态的变化，并将状态持久化到本地存储中。常用的Vuex持久化插件如vuex-persistedstate，它可以将Vuex的状态持久化到localStorage或sessionStorage中。如果不想使用持久化插件，也可以手动将Vuex的状态保存到本地存储中，并在页面加载时从本地存储中恢复状态。状态恢复：在页面加载时，通过AJAX请求从服务端获取初始状态，并将其保存到Vuex中。
2024-12-21 20:13:44
445
原创 vuex怎么防止数据刷新丢失？
常用的Vuex持久化插件如vuex-persistedstate，它可以将Vuex的状态持久化到localStorage或sessionStorage中。在使用本地存储时（如localStorage或sessionStorage），要考虑到数据的安全性和隐私性，避免存储敏感信息。如果不想使用持久化插件，也可以手动将Vuex的状态保存到本地存储中，并在页面加载时从本地存储中恢复状态。当使用服务端存储时，除了网络延迟和服务器负载外，还需要确保数据的完整性和一致性，以及服务端的安全性。
2024-12-21 18:05:38
607
原创 react子组件向父组件传参
在React中，子组件向父组件传参（或称为“通信”）通常通过事件的方式实现。父组件向子组件传递一个函数作为props，子组件在需要时调用这个函数，并可以通过参数的形式向父组件传递数据。
2024-12-21 17:59:29
502
原创 React与Vue的区别（相同点和不同点）
JavaScript是世界上最流行的语言之一，React和Vue是JS最流行的两个框架。但各有优缺点，本文将详细对比两大框架目录前言React主张是函数式编程的理念， 实现了前端界面的高性能高效率开发，react很擅长处理组件化的页面。React的官方网站提到了“学习一次，随处写作”这个关键功能，可以使用React框架在JavaScript中构建移动应用程序。在 React 中，所有的组件的渲染功能都依靠 JSX，它是JavaScript的语法扩展，它在创建UI组件和调试时非常简单有用。
2024-12-20 08:30:00
2025
原创 详解Ajax与axios的区别
Axios：提供了更多的功能，如拦截请求和响应、转换请求数据和响应数据、取消请求、设置请求超时时间等。Axios：提供了简洁、一致的API，使得开发者可以更加专注于业务逻辑的实现，而不是处理HTTP请求的底层细节。因此，Axios的开发效率更高。Axios：是isomorphic的（即同一套代码可以运行在浏览器和node.js中），因此在浏览器和Node.js环境中都可以使用。Axios：通过简单的API调用即可实现异步请求，如axios.get()、axios.post()等，使用更为便捷。
2024-12-19 08:55:11
730
原创 简述框架和函数库的区别
框架和函数库在软件开发中各有其优势和适用场景。框架通常提供了一套完整的解决方案和最佳实践，适用于需要快速构建高质量应用程序的场景；而函数库则提供了一系列基础的功能和工具，适用于需要实现特定功能但不需要完整解决方案的场景。在选择使用哪种方式时，需要根据项目的具体需求和团队的实际情况进行权衡和选择。框架和函数库在软件开发中各自扮演着重要的角色，但它们之间存在明显的区别。
2024-12-12 17:06:45
487
原创 为什么调用 setState 而不是直接改变 state
通过setState更新状态，实际上是创建了一个新状态对象来替换旧状态对象，而不是直接修改原状态对象。异步更新与批量处理：setState是异步执行的，React会对多次连续的setState调用进行合并和优化，从而避免不必要的多次渲染，提高性能。通过setState更新状态，就是以一种声明式的方式告诉React组件的状态需要变化，而React会负责处理具体的渲染和更新逻辑。避免不必要的重渲染：使用setState时，React能够智能地判断是否需要重新渲染组件，因为setState会触发组件的更新流程。
2024-12-12 17:03:54
274
原创 Vue vs. React：两大前端框架的深度对比与分析（二）
总结起来，Vue和React都采用了虚拟DOM和组件化开发的设计思想，通过提供响应式的数据绑定、高效的DOM更新和组件化的开发模式，使得构建用户界面变得更加简单、高效和易于维护。这些原理和设计思想的应用，使得Vue和React成为现代前端开发中不可或缺的工具。Vue和React都有自己独特的原理和设计思想，下面将详细介绍它们的主要原理和设计思想。
2024-12-09 08:15:09
823
2
原创 Vue vs. React：两大前端框架的深度对比与分析
Vue和React都以其独特的特点吸引了众多开发人员，但它们之间存在哪些区别和共通之处呢？本文将深入剖析Vue和React的原理、生态系统、API与语法、性能与优化以及开发体验与工程化等方面的差异，旨在帮助读者更好地了解这两个框架，为选择合适的技术栈提供参考。本文适合希望了解Vue和React之间差异的前端工程师、开发者以及对前端技术感兴趣的读者。无论你是初学者还是有一定经验的开发者，我们相信本文将为你提供有价值的信息和深入思考的机会。
2024-12-09 08:13:02
1021
原创 vuex/redux的异同？
Redux的reducer是一个纯函数，它接收旧的状态和一个action，并返回新的状态。Redux的action可以简单也可以复杂，简单的action直接发送数据对象，复杂的action则需要调用异步操作（依赖redux-thunk等中间件）。Redux：虽然Redux本身相对简单且通用，但通过与各种中间件和插件的结合使用，也可以实现复杂的异步操作和状态管理。然而，这可能需要更多的配置和集成工作。Vuex和Redux都是用于前端应用状态管理的工具，它们在许多方面有相似之处，但也存在一些关键的不同点。
2024-12-07 10:12:10
569
原创 React有什么特点？
React在内存中维护一个快速的轻量级JavaScript对象表示DOM，在每次状态更新时，React会比较新旧虚拟DOM的差异，并只将必要的更新应用到真实的DOM上，这大大减少了DOM操作的数量，提高了应用的性能。组件之间可以嵌套使用，形成完整的UI结构。综上所述，React以其声明式、组件化、高效性、灵活性、丰富的生态系统以及跨平台等特点，在前端开发中占据了重要的地位，并受到越来越多开发者的青睐。通过构建管理自身状态的封装组件，并对其组合以构成复杂的UI，React提高了代码的可重用性和可维护性。
2024-12-07 09:43:47
408
原创 什么是JSX
简而言之，JSX是React中用于声明UI的一种语法扩展，它使得在JavaScript中编写UI变得简单和直观。通过JSX，你可以像编写HTML一样编写React组件，同时享受JavaScript的灵活性和强大功能。
2024-12-06 17:52:18
246
原创 jsx的语法规则
避免在JSX中直接使用JavaScript语句：如前所述，JSX中只能嵌入表达式，不能嵌入语句。如果需要执行复杂的逻辑，可以在渲染JSX之前先计算好需要渲染的内容。表达式插值：在JSX中，可以将JavaScript表达式放在大括号 {} 中，以在渲染时插入动态内容。列表渲染：可以使用JavaScript数组的map()方法来遍历数组，并为每个元素生成对应的JSX元素，从而实现列表渲染。类名：在JSX中，由于class是JavaScript的保留字，因此为元素添加类名时需要使用className属性。
2024-12-06 17:48:45
301
原创 react的创建与书写
删除例如App.css、App.test.js、index.css、logo.svg、reportWebvitals.js、setupTests.js等文件，1.创建一个文件夹，shift+鼠标右键选择在此处打开powershell。2.安装路由 npm install react-router-dom。超全面详细一条龙教程！2.为了加速npm下载速度，先把npm设置为淘宝镜像地址。3.执行下面的npm安装react，那么基础的项目就搭建好了。保留核心index.js、App.js；
2024-12-06 17:44:23
533
原创 vue中如何点击事件，获取该点击元素
在上面的示例中，我们在`<div>`元素上添加了一个点击事件处理程序`@click="handleClick"`，当这个`<div>`元素被点击时，`handleClick`方法会被调用，并且传入一个事件对象`event`。通过`event.target`可以获取到被点击的元素。在Vue中，你可以通过事件处理程序（event handler）来监听点击事件，并通过事件对象（event object）获取点击的元素。
2024-11-21 21:22:51
421
原创 模块化是什么，组件化是什么，两者的区别是什么
**定义**：组件化是指将用户界面或功能单元拆分为相互独立、可复用的组件，每个组件都有自己的业务逻辑和展示效果。- **定义**：模块化是指将一个大型系统拆分为相互独立、功能相关的小模块，以便于开发、维护和复用。每个模块都有清晰的接口和功能边界，可以独立开发、测试和部署。1. **抽象层级不同**：模块化更多地关注于代码层面的组织和复用，而组件化更多地关注于用户界面或功能模块的组织和复用。2. **复用粒度不同**：模块化的复用单位更偏向于代码级别的功能模块，而组件化的复用单位更偏向于界面或功能单元。
2024-11-21 21:21:55
425
原创 axios的post请求，数据为什么要用qs处理？什么时候不用？
如果后端API设计为接收application/x-www-form-urlencoded类型的数据（这通常用于传统的表单提交），那么你需要将JavaScript对象（即你希望发送的数据）转换为这种格式。如果后端期望application/x-www-form-urlencoded格式的数据，则可能需要使用qs。如果后端期望application/json格式的数据（这是最常见的情况），则不需要使用qs，因为Axios已经为你处理了JSON的序列化和Content-Type的设置。
2024-11-15 22:29:23
912
原创 Vue-router的编程式导航有哪些方法？
Vue-router 提供了编程式导航的方法，这些方法允许你以编程的方式控制路由的跳转，而不是依赖于用户点击 <router-link> 组件。使用这些编程式导航方法时，需要确保你的 router 实例是可用的。在 Vue 组件中，你可以通过 this.$router 访问到它。注意：当使用 HTML5 History 模式时，API 可用时才有效。
2024-11-15 11:26:10
497
原创 Vue中的导航守卫有哪三种？分别有什么作用
这三种导航守卫在Vue Router中扮演着不同的角色，共同构成了路由导航过程中的控制和管理机制。通过这些守卫，开发者可以更加灵活地控制和管理应用的路由导航行为，提升用户体验和应用的健壮性。使用router.beforeEach注册，接收三个参数to（目标路由对象）、from（当前导航正要离开的路由对象）和next（一个函数，用于控制路由的跳转）。使用router.afterEach注册，与beforeEach和beforeResolve不同的是，它不接受next函数，也不会改变导航本身。
2024-11-15 11:21:02
446
原创 vue登陆验证
https://i-blog.csdnimg.cn/direct/93963711f2f44531a83a17d795f96432.png
2024-11-14 21:40:48
443
原创 vue的原理
**DOM 更新**：当数据发生变化时，Vue 会生成一个新的虚拟 DOM 树，并将其与旧的虚拟 DOM 树进行比较（diff），找出需要更新的部分，然后只对实际 DOM 进行最小化的更新。- **事件修饰符**：Vue 提供了一些事件修饰符，如 `.stop`、`.prevent` 等，简化事件处理。- **单文件组件**：Vue 支持使用 `.vue` 文件来定义组件，这种文件包含模板、脚本和样式，非常方便。- **组件化**：每个组件都是一个独立的 Vue 实例，有自己的数据、模板和方法。
2024-11-10 13:16:00
969
原创 单页面应用和多页面应用区别及优缺点
单页面应用（SPA, Single Page Application）和多页面应用（MPA, Multi Page Application）在多个方面存在显著的区别，并且各自具有独特的优缺点。
2024-11-10 08:32:21
499
原创 什么是组件及vue3常用框架组件。
⭐组件就像是搭积木一样的东西，可以用来构建软件或者系统。每个组件都有自己独立的功能和任务，就像一个小小的部件。你可以把这些小部件组合在一起，形成一个完整的应用程序或者系统。想象一下，你在玩积木，每个积木块都有不同的形状和功能，比如有的是方块、有的是圆柱体。你可以把这些积木块拼在一起，按照自己的想法组合出各种各样的结构，比如房子、桥梁、汽车等等。软件开发中的组件就像是积木块，你可以选择合适的组件并把它们组合在一起，来构建出一个完整的软件应用。使用组件化的方法，可以更加方便地开发和维护软件。
2024-11-10 08:15:21
689
原创 Vue中双向数据绑定是如何实现的？
Vue中的双向数据绑定是通过一种称为“响应式系统”的机制实现的，它允许数据对象与DOM保持同步。这种机制的核心在于Vue如何观察数据的变化，并在数据变化时更新DOM，以及在DOM变化时更新数据。这是Vue中实现双向数据绑定最直接的方式。Vuex是Vue的官方状态管理库，它提供了一个集中式的数据存储，用于管理共享的状态。父组件通过props传递数据给子组件，子组件在修改数据时，通过自定义事件将修改后的数据传递给父组件。通过这种方式，Vue实现了数据的双向绑定，使得开发者可以更加方便地构建响应式的Web应用。
2024-11-07 21:30:16
311
原创 Vue的生命周期函数有哪些?
对于Vue 2.x的用户，虽然大部分生命周期函数名称相同，但请注意Vue 2.x中没有onBeforeMount、onMounted、onBeforeUpdate、onUpdated、beforeUnmount和onUnmounted这些Composition API特有的生命周期函数。Vue的生命周期函数是指Vue实例从创建到销毁的过程中，会调用的一系列特殊函数，这些函数允许开发者在Vue的不同阶段执行特定的代码。Vue 2.x和Vue 3.x的生命周期函数有所差异，但总体思路是一致的。
2024-11-07 13:58:32
1118
原创 vue常用指令
这些指令是 Vue.js 中的基础，它们使得开发者能够以声明式的方式构建用户界面。Vue.js 提供了一些内置的指令，这些指令可以用来操作 DOM 或者添加一些特殊的响应式行为。：这个指令将在 Vue 实例结束编译时从绑定的 HTML 元素上移除。随后的重新渲染，元素/组件及其所有的子节点将被视为静态内容并跳过。：跳过这个元素和它的子元素的编译过程。：与 v-if 结合使用，当 v-if 的条件为假时渲染元素。：根据表达式的真假值切换元素的 display CSS 属性。：根据表达式的真假条件渲染元素。
2024-11-05 21:27:52
401
原创 vue发展史
在这个过程中，他发现现有的前端框架（如Angular和React）在某些方面存在不足，于是开始思考如何设计一个更简洁、高效且易于使用的前端框架。这个版本的Vue.js主要关注视图层，并提供了一些基本的功能，如数据绑定、条件渲染和列表渲染等。尽管功能相对有限，但Vue.js的简洁性和易用性吸引了大量开发者的关注。在未来，随着技术的不断进步和社区的发展，Vue.js将继续为开发者带来更多惊喜和便利。随着Vue.js的普及，其生态系统逐渐壮大。许多优秀的库和工具与Vue.js一起使用，共同构建更复杂的前端应用。
2024-10-31 21:38:14
399
原创 vue简介
在学习过程中，建议结合官方文档和实际项目进行练习，以更好地掌握Vue.js的知识点。Vue.js是一个渐进式JavaScript框架，用于构建用户界面。Vuex的核心概念（state、getters、mutations、actions）路由的基本概念（路由、路径、参数等）如何安装和使用Vue Router。Vue Router是什么？过滤器（filters）如何安装和使用Vuex。Vue.js是什么？如何安装Vue.js。创建第一个Vue实例。Vue实例与数据绑定。组件的嵌套和动态组件。
2024-10-31 21:37:11
354
原创 AJAX中get和post的区别
1. GET：请求的数据（如果有的话）会附加到URL的查询字符串中，并以键值对的形式出现（例如，?这意味着GET请求的数据长度是有限制的（由浏览器和服务器共同决定，但通常较短），且不适合传输敏感信息（因为URL可能会记录在浏览器历史、服务器日志等地方）。2. POST：请求的数据会放在请求体中发送，这意味着它可以传输大量数据，且不会受到URL长度的限制。1. GET：请求是可以被缓存的，这意味着如果两个GET请求完全相同（包括URL和所有参数），则浏览器可能会从缓存中加载响应，而不是再次向服务器发送请求。
2024-10-24 14:30:00
883
原创 ES6的Set 集合和Map 集合
1. size 返回 Map 的元素个数；2. set 增加一个新元素，返回当前 Map；3. get 返回键名对象的键值；4. has 检测 Map 中是否包含某个元素，返回 boolean 值；5. clear 清空集合，返回 undefined；
2024-10-23 14:31:14
394
原创 ES2017 新特性 （Async和await）
1、async 和 await 简化异步函数的写法；2、对象方法扩展 对象方法扩展；async 和 await 两种语法结合可以让异步代码看起来像同步代码一样；简化异步函数的写法；
2024-10-21 18:48:21
416
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人