~山花~-优快云博客

原创【IBMMQ】连接报错：JMSWMQ2013: 为队列管理器“XX”提供的安全性认证无效

许久没有使用的环境重新安装了一下，连接报错JMSWMQ2013: 为队列管理器“QM1”提供的安全性认证无效。。。更改用户、更改密码、创建通道等方法都无效。当阳光穿透云层，万物都为你让路。

2025-03-31 14:06:01 198

原创 Vue3实战笔记（65）—记录本项目浪费不少时间求证的问题

笔记最重要的作用就是温故而知新，最近遇到不少问题都是曾经遇到的，知道就是想不起来，查查自己的笔记都轻松解决了，老怀甚慰，深刻的意识到及时记录问题的重要性，今天记录几个最近遇到的几个看似简单解决起来却比较耗时的问题。这几个问题看似简单却无迹可寻，网上和官网找不到很直接的答案，都是一步步断点，看源码，分析原理思考各种可能性，慢慢探索解决。学习技术不能不求甚解，拿来主义，复制过来或者看看文档的用法，很多问题是自己解决不掉的。一入动画深似海。。。

2024-07-03 21:27:41 454

原创 Vue3实战笔记（64）—Vue 3自定义指令的艺术：实战中的最佳实践

在Vue3中，自定义指令是一种强大的工具，允许我们扩展HTML元素的功能。通过自定义指令，我们可以创建可重用的行为，并将它们绑定到任何元素上。下面，本文备份一些简单的Vue3自定义指令超实用案例，并解释其实际应用场景。

2024-07-03 21:11:38 852

原创 Vue3实战笔记（63）—解锁Vue 3的秘密武器：自定义指令全面掌握与创新应用

昨天学了自定义指令的初级用法，今天来点高级的，讲讲它的钩子和参数。// 在绑定元素的 attribute 前// 或事件监听器应用前调用// 下面会介绍各个参数的细节},// 在元素被插入到 DOM 前调用// 在绑定元素的父组件// 及他自己的所有子节点都挂载完成后调用// 绑定元素的父组件更新前调用// 在绑定元素的父组件// 及他自己的所有子节点都更新后调用// 绑定元素的父组件卸载前调用// 绑定元素的父组件卸载后调用参数详解。

2024-06-11 19:46:59 477

原创 Vue3实战笔记（62）—Vue3自定义指令入门：10分钟学会基础用法

Vue 3 中自定义指令（Custom Directives）的功能依然强大，但API相较于Vue 2有所改变，更加强调Composition API的使用方式。一个自定义指令由一个包含类似组件生命周期钩子的对象来定义。钩子函数会接收到指令所绑定元素作为其参数。// 在模板中启用 v-focus很简单一句话就能用了，我刚开始是没看懂的，这定义了一个函数怎么就能当指令用？测试一下，居然可行。在学过vue2的都知道指令是需要注册的，在没有使用//局部注册。

2024-06-11 19:42:28 589 1

原创 Vue3实战笔记（61）—Vue 3 Watch进化论：解锁实时数据监听新境界

Vue 3 中的 watch 功能相比Vue 2有了改进和扩展，旨在提供更灵活的数据监听方式。Vue 3的watch提供了一种强大的方式来监听数据变化，支持更细致的控制和更高效的逻辑处理。通过结合watchEffect，开发者可以根据具体需求灵活选择最适合的监听方式，从而提升应用的响应性和用户体验。蹉跎只能感动自己，行动才能打动别人。

2024-06-04 18:12:16 890

原创 Vue3实战笔记（60）—从零开始：一步步搭建Vue 3自定义插件

在开发和学习中，经常使用一些好用的插件，那么如何创建一个自己的插件呢？在 Vue 3 中，你可以通过创建一个包含 install 方法的对象来定义自定义插件。install 方法接收两个参数：Vue 应用实例（app）和可选的选项对象。// 输出一条消息到控制台console.log('山花自定义的插件安装成功!');// 全局混入一个方法console.log('这是山花自定义的插件!');// 如果提供了选项，可以在这里使用它们// 根据选项执行一些操作...

2024-06-04 18:06:40 1020 1

原创 Vue3实战笔记（59）—从零开始掌握Vue3插槽机制,进阶与提高

接上文，接下来看一点稍微复杂的：具名插槽最后这个官方提供的高级示例一定要好好看看，这为我们封装列表组件提供了很完美的思路。今天内容有点多，反复阅读，封装个自己的table组件啥的，掌握插槽不在话下。你的内心有一片宁静的海洋，无论外界如何波涛汹涌，都可以回归平静。

2024-06-02 03:35:51 873

原创 Vue3实战笔记（58）—从零开始掌握Vue3插槽机制,基础入门

不论是组件封装还是分析源码，实际开发中经常接触插槽，插槽是干什么用的呢？组件之间能够接收任意类型的 JavaScript 值作为 props，但组件要如何接收模板内容呢？在某些场景中，我们可能想要为子组件传递一些模板片段，让子组件在它们的组件中渲染这些片段。做自己的太阳，照亮自己的路，温暖自己的心。

2024-06-02 03:16:09 245

原创 Vue3实战笔记（57）—一键换肤：在Vuetify中打造个性化主题切换体验

在当今追求极致用户体验的时代，为应用程序提供个性化的主题切换功能已经成为提升用户满意度和留存率的关键因素之一。Vuetify，作为基于Vue.js的流行前端框架，以其丰富的组件库和高度可定制性，为开发者实现这一功能提供了便利。今天也把自己的项目中实现一键换肤，让应用界面随心所欲地在不同主题间自由切换，为用户带来全新的视觉享受图片。与其忧虑未来，不如拥抱现在。

2024-06-01 20:41:20 702

原创 Vue3实战笔记（56）—实战：DefineModel的使用方法细节

今天写个小例子，实战DefineModel的使用方法细节这样一来，通过 defineModel，子组件无需显式声明 props 和 emits，就能实现与父组件之间的自动双向绑定。草长莺飞二月天，拂堤杨柳醉春烟儿童散学归来早，忙趁东风放纸鸢。

2024-06-01 19:31:47 973

原创 Vue3实战笔记（55）—Vue3.4新特性揭秘：defineModel重塑v-model，拥抱高效双向数据流！

v-model 可以在组件上使用以实现双向绑定。从 Vue 3.4 开始，推荐的实现方式是使用 defineModel() 宏今天讲讲defineModel()的基本用法，后面会写一个实战小例子分析一下细节童年是梦中的真是真中的梦是回忆时含泪的微笑。

2024-05-31 19:29:07 551

原创 Vue3实战笔记（54）—揭秘Vue3实战：1分钟学会mitt，轻松玩转跨组件通讯

在 Vue3 中，由于官方移除了on\off 和 $once 实例方法，导致原先基于 Vue2 的事件总线（EventBus）模式不再适用。因此，对于需要进行组件间通信的场景，Vue3 推荐使用如 props、emits、provide/inject、vuex、pinia 等官方提供的方案。然而在某些情况下，开发者可能仍希望利用事件总线的简单性，特别是在小型项目中。这时，Mitt.js 就成为了一个推荐的选项，它提供了与框架无关、简洁且高效的事件监听和触发机制。

2024-05-31 19:14:08 632 1

原创 Vue3实战笔记（53）—奇怪+1，VUE3实战模拟股票大盘工作台

实战模拟股票大盘工作台最后，在学习 Vue 3 封装 ECharts 的过程中，我们可以总结以下几个关键点：安装依赖：首先需要安装 ECharts。注册组件：在 Vue 3 项目中，我们需要使用 defineComponent 和 app.component 方法来注册 ECharts组件。引入封装 ECharts：在需要使用 ECharts 的 Vue 组件中，我们需要引入 ECharts 和封装好相应的图表类型方便使用。

2024-05-30 11:33:33 775 2

原创 Vue3实战笔记（52）—Vue 3封装持仓分析饼图

接上文，封装持仓分析饼图。封装好几个组件，用于后续开发。把忧愁煮成茶，让它在心间慢慢沉淀，剩下的，便是清甜的回味。

2024-05-30 11:27:58 827 1

原创 Vue3实战笔记（51）—Vue 3封装带均线的k线图

继续封装一个封装带均线的k线图那些上演着繁华不肯谢幕的年华里开出一朵地老天荒的花。

2024-05-29 18:20:45 656 1

原创 Vue3实战笔记（50）—Vue 3+ECharts还能看股票？附源码

今天封装股票k线图组件前几天学的几个知识点都有用到，都是在封装k线图的时候遇到的问题，又啃了一遍基础。世间所有的相遇，都是久别重逢。

2024-05-29 16:49:31 369

原创 Vue3实战笔记（49）—Vue 3响应式魔法：ref vs reactive深入对决

Vue 3 中的 ref 和 reactive 都是用于创建响应式数据的工具，但它们之间存在一些重要的区别。总的来说，ref 和 reactive 都是Vue 3中强大的响应式API，选择使用哪一个取决于具体的使用场景和性能考虑。对于基本数据类型或需要替换对象的场景，ref 是合适的选择；而对于需要创建一个响应式状态容器的对象，reactive 是更好的选择。轻挥一袖桃花雨，醉卧云水笑春阳。

2024-05-28 11:12:49 1240

原创 Vue3实战笔记（48）— reactive大揭秘：Vue 3中复杂数据结构的响应式处理

前些天了解了ref，开发时候大部分时候都是直接用ref，其实还有reactive这玩意，有时候用起来更方便，不需要.value,本文介绍一下。在 Vue 3 中，reactive 是一个用于创建响应式对象的函数。通过 reactive，你可以将一个普通的 JavaScript 对象转换为响应式对象，使得其属性的变化能够触发视图更新。需要注意的是，虽然 reactive 可以处理嵌套的数据结构，但当你解构响应式对象时，解构出来的属性将失去其响应性。

2024-05-28 10:54:31 654

原创 Vue3实战笔记（47）— 一探emit奥秘——组件间通信的艺术与实践

Vue封装了自定义组件之后，如果子组件想要向父组件传递数据该怎么办？Vue.js 中的 emit 方法就是主要用于组件间的通信，特别是父组件与子组件之间的通信机制。它是 Vue 组件内部触发自定义事件并向父级组件传递数据的一种方式。做一个积极向上的人，给自己和他人带来阳光。

2024-05-27 01:40:50 896

原创 Vue3实战笔记（46）—Vue 3高效开发定制化Dashboard的权威手册

后台管理系统中的Dashboard是一种图形化的信息显示工具，通常用于提供一个特定领域或系统的概况。它可以帮助用户监控和分析数据，快速获取重要信息。可以帮助用户监控业务状况、分析数据、获取关键信息和管理资源。通过合理的设计和使用，Dashboard可以大大提高工作效率和数据可视化的效果。乐观面对生活，一切都会变得美好。

2024-05-27 01:35:58 1358 1

原创 Vue3实战笔记（45）—VUE3封装一些echarts常用的组件，附源码

日前使用hooks的方式封装组件，在我使用复杂的图标时候遇到了些问题，预想在onMounted中初始化echarts，在使用hooks的时候，组件没有渲染完，使用实例会出现各种各样的问题，并且在hooks中使用一些外部属性也属实遇到了些麻烦，先用蠢方法直接封装两个插件做dashboard用，后面有时间重新完善封装echarts。为啥这两天封装了好几个echarts组件呢，上头了一样，通过封装ECharts组件，可以将图表的基本配置、数据处理、事件处理等逻辑封装在一个组件中，从而实现代码的复用。

2024-05-26 03:46:31 783

原创 Vue3实战笔记（44）—vue3组件的ref属性

之前学习过ref声明响应式对象，前几天读代码遇到了发懵的地方，详细学习了一下才发现，用法还有很多，遂总结一下ref的用法备忘。Vue3 中的 ref 是一种创建响应式引用的方式，它在Vue生态系统中扮演着重要角色。以下是Vue3中ref属性及其相关API的几个关键点：创建响应式变量：使用 ref 函数可以创建一个响应式的数据引用，返回的对象包含 .value 属性，该属性既可以读取也可以写入，并且是响应式的。Javascript2// 创建一个响应式引用，初始值为0// 输出0。

2024-05-26 03:38:41 3478

原创 Vue3实战笔记（43）—Vue3组合式API下封装可复用ECharts图表组件

接上文，已经安装好了ECharts，开始封装组件方便使用。把常用的都封装好，这样使用起来方便多了。千行代码，一 bug 倾城。

2024-05-25 19:04:24 1013

原创 Vue3实战笔记（42）—Vue + ECharts：流量数据可视化的强大组合

在前端开发中，数据可视化已经成为了一个不可或缺的部分。Vue.js作为一个轻量级且易于上手的渐进式JavaScript框架，与ECharts这个强大的数据可视化库的结合，使得在Vue应用中构建交互式数据可视化图表变得异常简单和高效。在Vue中使用ECharts时，我们还需要注意一些性能优化的问题。例如，当图表数据较多时，我们可以通过懒加载或分页加载的方式来减轻页面的性能压力。另外，我们还可以通过合理的配置和代码优化来减少图表的渲染时间和内存占用。

2024-05-25 18:16:37 1408

原创 Vue3实战笔记（41）—自己封装一个计时器Hooks

在Vue项目中，封装一个计时器挂钩（Hook）是一种实用的技术，它允许你在组件中方便地管理定时任务，如倒计时、计时器等，而无需在每个使用场景重复编写相同的逻辑代码。愿离别之花，开得绚丽多彩，在人生的旅途中，照亮前行的路。

2024-05-24 21:28:03 545

原创 Vue3实战笔记（40）—组件逻辑复用：自定义Hooks的完全指南

自定义Hooks是Vue3中的一个重要特性，它允许您创建可重用的函数，以便在组件之间共享状态和逻辑。以下是一些关于自定义Hooks的常见用法。通过创建自定义Hooks，可以将组件的逻辑和状态提取到可重用的函数中，从而使代码更加模块化和易于维护。离别之花，在心中盛开，哀愁的种子，生根发芽。但愿这花，开得璀璨耀眼，让离别的苦涩，化作芬芳的源泉。

2024-05-24 21:15:07 742

原创 Vue3实战笔记（39）—封装页脚组件，附源码

2024-05-23 21:01:52 640

原创 Vue3实战笔记（38）—粒子特效终章

官方还有很多漂亮的特效，但是vue3只有一个demo，例如我前面实现的两个页面就耗费了一些时间，今天记录一下tsparticles官方内置的几个特效的使用方法，一般这几个就足够用了。世间万物皆为我所用，非我所属。

2024-05-23 20:54:54 558

原创 Vue3实战笔记（37）—粒子特效登录页面

上头了，再来一个粒子特效登录页面。行到水穷处，坐看云起时。

2024-05-22 21:53:36 806

原创 Vue3实战笔记（36）—粒子特效完成炫酷的404

昨天介绍了一个粒子特效小例子，不够直观，下面直接实战在自己的项目中实现一个好玩滴。一切福田，不离方寸；从心而觅，感无不通。

2024-05-22 21:47:20 652

原创 Vue3实战笔记（35）—集成炫酷的粒子特效

学习一个有趣炫酷的玩意开心一下。tsparticles，可以方便的实现各种粒子特效。支持的语言框架也是相当的丰富.官网：https://particles.js.org/只是按照官网的示例运行成功了，还有很多很多其他炫酷的示例没有测试，后续还会继续研究一番。不要因为结束而哭泣，微笑吧，为你的曾经拥有。

2024-05-21 17:39:06 1051

原创 Vue3实战笔记（34）—完美的菜单组件封装

之前简单的封装了一下菜单组件，数据都是写死的，多层嵌套没有支持，学完了组件传值，计算属性就可以继续完善了。在前文的基础上对左侧导航栏组件完善了一下。心向阳光，阴影自退。

2024-05-21 17:10:29 610

原创 Vue3实战笔记（33）—组件传值props终章

在 Vue 3 中，组件的声明方式主要有两种：运行时声明和基于类型的声明。这两种方式在 Vue 3 的 Composition API 中体现得尤为明显。这是一种传统的 Vue 组件声明方式，它主要依赖于 Vue 的运行时特性。在 Vue 2.x 中，这种方式主要通过 options API 实现，例如 data、methods、computed、watch 等。在 Vue 3 中，虽然 Composition API 被引入，但运行时声明仍然是一种可选的方式。

2024-05-20 13:18:16 1626

原创 Vue3实战笔记（32）—组件传值props第三天还很细

Vue 组件可以更细致地声明对传入的 props 的校验要求。比如我们上面已经看到过的类型声明，如果传入的值不满足类型要求，Vue 会在浏览器控制台中抛出警告来提醒使用者。这在开发给其他开发者使用的组件时非常有用。本文很细，基于官方文档的解读，注意文中强调的注意事项，都是实际应用时候的心得体会，每个注意事项都是示例验证过，放心享用。心若没有栖息的地方，到哪里都是在流浪。

2024-05-20 11:41:03 955

原创 Vue3实战笔记（31）—组件传值props第二天特别细

今天聊聊Prop传值的一些细节.今天内容有点多，慢慢消化，多做实战测试。做一个简单的人，平和而执着，谦虚而无畏，未来的日子，我们都能安之若素。

2024-05-19 20:49:57 1127

原创 Vue3实战笔记（30）—组件传值props第一天

开发期间各个组件之间必定要互相交互传值，之前学习路由的时候介绍了几种传值方式，今天再详细的研究一下各个组件之间但不限于路由的传值Props。简简单单入门的语法就介绍到这，明天再深入一下。生活本来很不易，不必事事渴求别人的理解和认同，静静的过自己的生活。心若不动，风又奈何。你若不伤，岁月无恙。

2024-05-19 20:38:01 449

原创 Vue3实战笔记（29）—计算属性computed

写一个小功能想用一下计算属性computed，因为之前都是用vue2，不太习惯vue3的写法，所以才有了记录下来的想法，顺便温故一下。从计算属性返回的值是派生状态。可以把它看作是一个“临时快照”，每当源状态发生变化时，就会创建一个新的快照。更改快照是没有意义的，因此计算属性的返回值应该被视为只读的，并且永远不应该被更改——应该更新它所依赖的源状态以触发新的计算。人生最大的遗憾不是你做不到，而是你本可以。

2024-05-18 20:22:51 376

原创 Vue3实战笔记（28）—嵌套路由方式重新设计布局

在Web开发中，嵌套路由是一种常见的布局设计模式，它允许开发者构建具有层次结构的页面，从而提供更丰富、更直观的用户体验。使用嵌套路由，开发者可以在不同的页面区域展示不同的内容，同时保持应用程序的整洁和可维护性。嵌套路由的核心思想是将页面分为几个部分，每个部分都有自己的路由配置。这样，当用户导航到特定页面时，只有相关的部分会重新加载，而不是整个页面。这种方法可以提高应用程序的性能，并减少不必要的网络流量。

2024-05-18 19:53:18 663

原创 Vue3实战笔记（27）—vuetify过渡动画

今日，让我们一起探索Vuetify框架中的过渡动画效果，感受它们如何为界面增添活力与魅力。Vuetify不仅以其优雅的设计和强大的功能著称，还提供了丰富的过渡动画效果，让开发者能够轻松打造出流畅且吸引人的用户界面。通过学习这些动画效果，你将能够为你的Web应用注入生命力，提升用户体验。从简单的淡入淡出到复杂的旋转动画，Vuetify的过渡动画效果将帮助你实现令人印象深刻的视觉效果。今天，就让我们深入学习这些动画效果，掌握如何在你的项目中实现它们，让你的应用界面更加生动和有趣。

2024-05-17 22:38:21 858 1

绿色中文版ue

空空如也