草庐IT

nodejs_vue

全部标签

Vue3 如何实现一个函数式右键菜单(ContextMenus)

前言:最近在公司PC端的项目中使用到了右键出现菜单选项这样的一个工作需求,并且自己现在也在实现一个偶然迸发的idea(想用前端实现一个windows系统从开机到桌面的UI),其中也要用到右键弹出菜单这样的一个功能,个人觉得这个实现还不错,特来分享🎁。tips:我个人是喜欢使用图文来讲解知识点的,相比于直接讲概念,我个人更倾向于使用费曼学习法来讲解某一个功能的实现过程,因为我也是刚从一只菜鸟走过来,所以我更加清楚一个新手在去学习一个全新的知识的时候,他其实不是需要你给他讲实现原理,而是你需要作为一个“引路人”让他先简单知道这个知识是用来干什么的,后面随着他自己一步一步的深入了解,他会自己慢慢领悟

SpringBoot+Vue项目部署(传统方式)

目录一,后端部署1,项目打包1.1,引入插件1.2,maven打包1.3,修改项目版本号1.4,验证1.5,生成配置文件2,服务器环境搭建2.1,安装JDK1)下载2)tar包安装3)rpm安装2.2,MySQL安装2.3,Windows开放MySQL远程连接1)开放远程连接2)开放3306端口3,上传jar包,编写shell脚本4,验证二,前端部署1,Vue项目打包2,Nginx的安装与配置2.1,Nginx安装2.2,编写配置文件三,说明:一,后端部署1,项目打包1.1,引入插件该插件会将SpringBoot项目打包成一个可以运行的jar包,可以用java-jarjar包名称启动。buil

【源码系列#02】Vue3响应式原理(Effect)

专栏分享:vue2源码专栏,vue3源码专栏,vuerouter源码专栏,玩具项目专栏,硬核💪推荐🙌欢迎各位ITer关注点赞收藏🌸🌸🌸Vue3中响应数据核心是reactive,reactive的实现是由proxy加effect组合,上一章节我们利用proxy实现了一个简易版的reactive,#【源码系列#01】Vue3响应式原理(Reactive)。接下来让我们一起手写下effect的源码effecteffect作为reactive的核心,主要负责收集依赖,更新依赖在学习effect之前,我们再来看下这张图targetMap:存储了每个"响应性对象属性"关联的依赖;类型是WeakMapdep

小白系列Vite-Vue3-TypeScript:011-登录界面搭建及动态路由配置

前面几篇文章我们介绍的都是Vite+Vue3+TypeScript项目中环境相关的配置,接下来我们开始进入系统搭建部分。本篇我们来介绍登录界面搭建及动态路由配置,大家一起撸起来......搭建登录界面登陆接口api项目登陆接口是通过mockjs前端来模拟的模拟服务接口LoginApi首先在src/mock文件夹下新建login.ts文件,模拟两个服务接口(验证码获取+用户登录)import{MockMethod}from'vite-plugin-mock';exportconstLoginApi:Array=[{url:'/api/captchaImage',method:'get',resp

Taro + VUE 小程序环境搭建

安装Cli工具安装:$yarnglobaladd@tarojs/cli项目初始化:taroinitmyApp注意:如下命令中选用了nut-ui,即京东开发团队提供的跨端组件库。➜taroinitmyApp👽Tarov3.6.6Taro即将创建一个新项目!Needhelp?Goandopenissue:https://tls.jd.com/taro-issue-helper?请输入项目介绍?请选择框架Vue3?是否需要使用TypeScript?Yes?请选择CSS预处理器(Sass/Less/Stylus)Sass?请选择编译工具Webpack5?请选择包管理工具pnpm?请选择模板源Githu

【开源】基于Vue和SpringBoot的生活废品回收系统

项目编号:S003,文末获取源码。\color{red}{项目编号:S003,文末获取源码。}项目编号:S003,文末获取源码。目录一、摘要1.1项目介绍1.2项目录屏二、研究内容三、界面展示3.1登录注册3.2资源类型&资源品类模块3.3回收机构模块3.4资源求购/出售/交易单模块3.5客服咨询模块四、免责说明一、摘要1.1项目介绍生活废品回收系统是可持续发展的解决方案,旨在鼓励人们分离和回收生活垃圾,减少环境污染和资源浪费,生活废品回收系统涵盖了城市居民的日常生活,包括收集、分类、处理和收集废物的完整过程。本文提出了一种基于Vue技术的生活废品回收系统,该系统可以通过垃圾的收集和销售来支持

Vue3 学习笔记,Vue 简介及如何引入 Vue3 框架

大家好,从本篇文章起,我将从Vue最基础的内容开始梳理相关,本篇文章我将聊一聊什么是Vue,以及如何引入Vue3框架,以及一些开发环境的配置。Vue.js是什么?解决了哪些问题?Vue.js是一个开源的JavaScript框架,用于构建用户界面。它的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。Vue.js能够帮助开发人员构建单页面应用程序(SPAs),尤其是那些具有复杂的用户界面和交互的应用程序。Vue.js的核心是一个轻量级的视图模型,它允许开发人员声明式地将数据绑定到DOM,并使用组合的组件复用视图逻辑。这使得Vue.js非常适合用于构建可维护的单页面应用程序。如何引入

webpack5模块联邦(Module Federation)使用教程,在vue2中使用

博客示例demo已经上传giteeModuleFederation可以实现微前端的效果,只是它是模块级的。即一个应用可以引入另外一个应用的模块。例如在a域名下启动的应用里,可以直接引用b域名应用里的资源。也就是说a应用可以异步获取b应用的组件进行使用。这样就可以将应用分为更小的应用块,头部导航栏、侧边栏、业务逻辑组件都可以分到不同的应用块里开发,同时应用块间间可共享,互相依赖,可实时获取其它应用块构建好的bundle资源。在入门前,先对一些概念达成共识:在ModuleFederation中,每个应用都是一个独立的构建(webpack工程),称为容器。引用远程模块的应用叫作host,被引用模块所

鸿鹄工程项目管理系统 Spring Cloud+Spring Boot+Mybatis+Vue+ElementUI+前后端分离构建工程项目管理系统项目背景

 鸿鹄工程项目管理系统SpringCloud+SpringBoot+Mybatis+Vue+ElementUI+前后端分离构建工程项目管理系统1.项目背景一、随着公司的快速发展,企业人员和经营规模不断壮大。为了提高工程管理效率、减轻劳动强度、提高信息处理速度和准确性,公司对内部工程管理的提升提出了更高的要求。二、企业通过数字化转型,不仅有利于优化业务流程、提升经营管理能力和风险控制能力,还可强有力地促进企业体制机制的全面创新。三、以数据要素为核心,协同创新加快企业数字化转型、优化资源配置效率,是数字经济时代提升企业市场竞争力和价值创造能力的关键所在。四、在企业里建立一个管过程、提效率、降风险、

管道在Vue和Angular中的作用及React的替代方案

管道在Vue和Angular中的作用及React的替代方案前言管道起源管道特点前端中管道概念和作用概念作用React关于管道的替代方案Vue和Angular管道的区别前言本文主要讲解管道在Vue和Angular中有哪些作用以及React对于管道概念的替代方案是什么。管道起源计算机中的Pipline(管道)常被认为起源于Unix,最初Mcllroy发现很多时候人们会将shell命令的输出传递给另一个shell命令,类似于管道。所以就提出了管道的概念。并在1973年实现了这个管道概念,使用|作为pipe的语法符号。此后,很多操作系统也引入了pipe概念,而Angular和Vue框架都引入了这个概念