程序小猿yy-CSDN博客

原创 Vue3中使用element plus中的el-popover弹出框，实现弹出框的位置跟随鼠标点击的位置进行显示

打开element plus官网我们发现，一般的popver用法就是让这个组件绑定一个button按钮，然后点击，悬浮或者别的方式让其展示。这两天接到个新需求，要求当用户点击一个元素时，让popover弹窗的位置跟随鼠标点击的位置进行显示。我们点击元素框，popver出现，当我们点击右上角“”x“”时关闭，再次点击元素内别的地方，popver再次出现在点击的位置，至此，该功能改造完成！此时我们不难想到，要求实现鼠标跟随，就得获取鼠标点击的位置，当获取到鼠标点击的位置的时候，我们把(

2024-09-10 15:30:27 582

原创 Vue3中的pinia的使用和pinia数据的持久化存储

文件，我们点击“点击增加”按钮时，pinia存储的money值则会增加，username信息也在页面上显示。由于在counter.js里面给“money”字段增加了持久化存储，再次刷新页面，money存储的数据还是没发生变化，说明pinia数据持久化成功！前言：V3中的pinia其实就是vuex的升级版，用法跟vuex差不多，都是作为属性存储和传值的工具，但它们都有个问题，就是当页面刷新过后，更新的值都会丢失。这里就做个记录，也给大家分享下pinia的基本用法跟如何持久化存储数据。

2024-09-04 15:06:47 402

原创 element ui中message消息提示弹出个数太多，以及dialog对话框遮罩遮住message消息提示的问题

前言：在开发中，我们经常会用到这个message消息提示组件，提示用户操作成功，用户操作失败等，但是随着业务场景的增加，我们对消息提示的这个组件功能也会随之调整，鄙人在开发中就遇到下列问题：1.1.1我们创建一个reMessage.js文件，在文件里我们可以这样写1.1.1 在vue2中使用在main.js文件中，我们引入reMessage.js文件，如下图注意：标记4一定要写在标记3：Vue.use（elementui）之后在配置好上述步骤后，我们可以在该项目任意.vue文件里面使用下面的方法。

2024-09-04 10:52:48 359

原创 Vue3.0实现路由懒加载和设置路由守卫

2.路由守卫，一般用到最多的就是登录权限校验，判断用户是否登录，一般使用的最多的还是全局前置守卫（beforeEach），我这举的例子就是简单的判断登录状态，若有其他的需求可根据官方文档自行更换配置。这样，我们在项目中，路由懒加载的配置和路由守卫就完成了！这在开发过程中也是必不可少的。文件中，我们引入并且使用。

2024-09-02 14:22:13 439

原创 Vue实现封装axios，配置get，post，put等多种请求方式,并且实现全局接口调用

前言：鄙人前端开发三年，做了不少项目了，我发现我参与的大部分项目没有对请求接口参数这块进行配置，每次请求接口都得引入文件，挨个配置参数等，感觉太繁琐了，后面我就自己配置了下，在这做个记录，也给大伙分享一下。这样配置好后，我们再也不用每次调接口的时候，都得import一下，而且每个接口都写一坨配置信息啦！现在，我们在该项目的任何.vue文件里，都可以使用“（该文件配置请求方式post，get，put等），”文件夹，再在该文件夹下创建三个js文件，分别为。（该文件写我们的接口），

2024-09-02 11:20:32 1133

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人