- 博客(31)
- 收藏
- 关注
RSS订阅
原创 基于vue3与mqtt实现的小应用
本文介绍了如何在Vue3中使用MQTT.js实现MQTT通信。主要内容包括：1)安装MQTT.js库；2)创建包含连接控制、状态显示、消息收发功能的Vue组件；3)详细代码实现，包括MQTT连接/断开、消息订阅/发布、本地IP获取等功能；4)组件样式设计。文章还提供了两个免费的公共MQTT测试服务器地址，适用于WebSocket连接的MQTT通信。该方案适合需要在浏览器中实现MQTT通信的Vue3项目。
2025-07-02 09:32:22
166
原创 Flexbox + Grid 组合布局技术解析
本文探讨了Grid和Flexbox在网页布局中的协同应用。Grid适用于二维布局控制，用于整体框架设计（如区域划分、卡片网格），通过grid-template-areas和自动填充实现响应式布局。Flexbox则擅长一维排列，应用于导航、菜单等组件内部布局。响应式设计要点包括：移动端隐藏侧边栏、单列布局转换，配合过渡动画和rem单位间距系统。两种布局技术的组合使用，既能实现宏观结构控制，又能满足微观组件需求，形成完整的布局解决方案。
2025-05-30 13:48:33
283
原创 征服Windows版nginx（2）
注意：确保Nginx的配置文件中的路径是正确的，并且Vue项目已经构建完成。如果你的Vue项目使用了history模式的路由，还需要确保Nginx配置中有正确的。打开任务管理器结束Nginx.exe的所有进程后，重新进入安装Nginx位置，右键以管理员身份运行。运行后可打开任务管理器查看，成功后可以看到两个nginx.exe的进程，代表nginx重启成功。例如，假设你的Vue项目构建后的静态文件被放置在。能看到你的Vue项目（注：这里是80端口默认没写，如更换其他端口请在后面加上端口号。
2025-01-13 08:54:56
485
原创 征服Windows版nginx（1）
进入nginx官网下载这里选择的是稳定版 windows系统点击下载完成后，将压缩包解压到你需要安装的地方。
2025-01-03 13:41:11
300
原创 轻松上手使用Vuex
Vuex 提供了结构化和可预测的状态管理方案，尤其适用于大型单页应用。通过 state、mutations、actions 和 getters 这几个核心概念，可以清晰地管理应用的状态和状态变更逻辑。在实际应用中，合理使用 Vuex 可以显著提高代码的可维护性和可读性。
2024-12-03 14:51:41
446
原创 在vue3中调接口不确定是否有返回值，用到‘?’处理防止后续调用函数方法出现错误
在 Vue 3 中调用后端接口时，如果不确定是否有返回值，可以通过合理地处理异步请求和响应来实现优雅的后处理。以下是一个使用 Vue 3 和 Axios 的示例，展示如何处理这种情况。
2024-11-27 08:48:14
250
原创 前端开发中v-if 与v-show的区别
如果元素在条件变化时需要频繁地显示或隐藏，并且对性能要求较高，建议使用v-show。如果元素在条件变化时很少需要重新渲染，或者需要重新初始化一些绑定的事件监听器或子组件，建议使用v-if。在实际开发中，根据具体的应用场景和需求选择合适的指令，可以使得应用更加高效。
2024-11-25 13:53:08
354
原创 鸿蒙心路旅程：鸿蒙之路，国富民强之路
多希望我国也能有与安卓ios抗衡的操作系统，这次外部的制裁更是紧促的让华为对鸿蒙系统加快研究，也让年轻人有了咱们国家要有自己的操作系统的想法我们一定要去支持，现在，鸿蒙的诞生经过不断迭代，2024年鸿蒙生态已成，成为iOS、安卓之外的第三极，也让世界知道了鸿蒙系统。当时很佩服苹果的生态，将平板手机手表互动玩的很极致，现在鸿蒙系统也终于做到了，原生鸿蒙系统在多设备、多场景下的无缝体验、AI能力的深度融合以及安全性的显著提升，鸿蒙系统生态扩展迅速，如今鸿蒙系统已覆盖10亿台设备，包括手机、平板、智慧屏等。
2024-11-21 15:05:50
901
原创 将el-table表行颜色根据属性值自定义样式
属性返回不同的类名。然后在CSS中定义了相应的样式。这样表格中的行颜色就会根据rowIndex。以下是一个简单的例子，演示如何根据行数据中的rowIndex。在Vue.js中使用Element UI的el-table。在上面的例子中，tableRowClassName。组件时，可以通过使用row-class-name。这个属性来根据行的属性值来自定义行的颜色。方法根据行数据中的rowIndex。
2024-11-21 10:28:41
750
原创 前端部署踩坑分享
最近部署前端发生一件踩坑事件，分享给大家避雷，本地运行无问题无报错，整合部署后发现在服务器上不报错但是路由很慢进不去页面，分析了路由 router.js配置页面发现无改动，怀疑后端返回路由权限拼写不一致，看了后端路由权限位置也没问题，最后在前端一部分一部分删除页面代码排除问题，发现import 接口引入的方法被整合时候替换没了，加入后路由恢复正常 无报错。import方法 有时候不报错但是问题就出现在这 巨坑！
2024-11-19 15:42:51
160
1
原创 Js 利用filter筛选数组中符合多个条件的项
函数结合多个条件来筛选数组。你可以创建一个函数，该函数将返回一个新的数组，其中包含满足所有条件的元素。以下是一个简单的例子，假设我们有一个对象数组，我们想要筛选出那些年龄大于20且名字以"J"开头的对象。如果这个条件为真，元素就会被添加到结果数组中。在这个例子中，我们使用了。函数接受一个箭头函数作为参数，该箭头函数对每个。在JavaScript中，你可以使用。操作符来组合两个条件。
2024-11-18 15:07:07
1008
原创 js判断字符串首字母是否相等
要判断JavaScript中两个字符串的首字母是否相等，可以直接比较两个字符串的第一个字符。接收两个字符串参数，并返回它们首字母是否相等的布尔值。函数来处理大写字母，确保比较不会因为字符大小写不同而出现错误。
2024-11-18 14:13:36
374
1
原创 在vue3中使用js加css实现闪烁效果
类被应用到文本上，导致其透明度逐渐减小到0，实现闪烁效果。当组件被卸载时，定时器会被清理。在这个例子中，当组件被挂载时，会设置一个定时器每秒钟切换。定义一个Vue组件，该组件包含一个可以切换的属性，比如。标签在组件内定义CSS，用来控制闪烁效果。使用Vue的响应式属性来周期性地改变。来控制元素的显示与隐藏。的值，从而实现闪烁效果。
2024-11-12 14:24:37
713
原创 webpack 使用步骤
4. 编写打包脚本：在package.json文件中的scripts字段中添加一个打包命令，例如`"build": "webpack"`，以便在命令行中运行`npm run build`来执行打包。1. 安装webpack：在项目根目录下运行`npm install webpack --save-dev`，将webpack安装到项目的开发依赖中。5. 运行打包命令：在命令行中运行`npm run build`命令，webpack将根据配置文件中的设置，将项目中的源代码打包成静态资源文件。
2024-11-12 09:49:40
459
原创 CSS定位（position）的五种定位方式及其特点
静态定位（static）相对定位（relative）绝对定位（absolute）固定定位（fixed）粘性定位（sticky）
2024-11-12 07:59:56
336
原创 相对路径 与 绝对路径的区别
在实际开发中，通常推荐使用相对路径，因为这样可以保证无论组件在项目中的位置如何，引用的资源都能正确找到。绝对路径虽然简单，但如果项目结构变化，路径可能需要大幅度更新，不推荐用于生产环境。例如，如果你有一个图片文件和一个Vue组件文件，它们位于同一目录下，你可以使用相对路径来引用这个图片。2.绝对路径（Absolute Path）：绝对路径是从项目的根目录开始的完整路径。例如，你可以使用绝对路径来引用一个位于项目根目录下的。在Vue中，相对路径和绝对路径通常指的是在引用资源文件时使用的路径类型。
2024-11-11 16:23:34
443
原创 点击当前行的按钮获取el-table 当前行内容
方法会在点击表格中的按钮时被触发，并接收到当前行的数据。这样你就可以根据需要处理这些数据了。属性和事件处理函数来获取当前行的内容。在Vue.js中使用Element UI库时，可以通过。方法会在点击表格的某一行时被触发，并接收当前行的数据。
2024-11-07 08:26:33
1163
原创 从JavaScript转到TypeScript 时需要注意以下几点
通过以上步骤和方法，可以有效地将JavaScript代码迁移到TypeScript，并充分利用TypeScript提供的类型检查和编译时错误检查功能，提高代码的质量和维护性。：使用支持TypeScript的编辑器（如Visual Studio Code）可以提供更好的代码补全、代码导航和重构等功能，提高开发效率。：启用TypeScript的严格模式可以提供更严格的类型检查，帮助发现更多的潜在问题。：TypeScript有庞大的社区和丰富的第三方库，可以更方便地使用和共享代码。
2024-11-06 15:02:50
487
原创 vue3 封装一个包含el-table的el-dialog组件
这种组件是函数式组件的一种形式，它们是无状态且没有实例的Vue组件。是我们创建的带有表格的对话框组件，你需要将它导入到你的父组件中，并通过。是通过父组件传递进来的，用于展示在表格中的数据。是一个响应式引用，控制对话框是否显示。在Vue 3中，可以通过使用。在这个组件中，我们使用了。来定义组件的逻辑，并通过。语法糖来创建一个包含。属性传递数据和标题。
2024-11-06 14:51:58
283
原创 多层结构变量赋值使用深拷贝不会改变原有变量
深拷贝是一种将源对象的数据完全复制到另一个对象的过程，确保源对象与拷贝对象相互独立。这意味着，无论是对拷贝对象还是源对象进行的任何修改，都不会影响到另一个对象。深拷贝的实现通常涉及到递归函数的使用，以确保所有嵌套的对象都被正确地复制，包括对象的所有层级和属性。这意味着，如果对象内部包含可变元素（如数组或对象），浅拷贝只是复制了这些元素的引用，而不是元素本身。因此，对浅拷贝对象的修改可能会影响到原始对象，因为它们共享相同的可变元素。
2024-07-22 17:04:25
265
原创 习惯养成-声明变量篇
声明变量要根据实际情况尽可能少的占用系统内存，使用后不再使用时便释放内存，所以只在某个函数方法里使用时可以将变量声明在函数方法内封装起来，在调用完函数方法后就会释放内存地址。
2023-07-25 11:23:24
1232
原创 关于时间复杂度理解
对于有两层循环嵌套结构的普通算法的时间复杂度：O(n^2)对于有一层循环结构的普通算法的时间复杂度：O(n)对于没有循环结构的普通算法的时间复杂度：O(1)对于循环中有乘法的算法：O(logn)
2023-07-24 10:12:30
1271
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人