logic-flow 使用过程中遇到的bug - 拖动节点到画布的时候,鼠标松开,节点不落在画布,仍旧跟着鼠标走

背景:
插件:logicFlow
用途:画流程图
bug表现:

初始化的样子:
在这里插入图片描述
bug的样子:
拖动第一个节点的时候,一切正常(无论哪个节点作为第一个节点,都是正常的,但是拖动第二个节点的时候,节点面板出现重影一样的效果,如图)
在这里插入图片描述
此时选中的节点会一直跟随鼠标移动,不落在画布上,需要单击鼠标左键才可以落下,落下后,控制台会报错如下
在这里插入图片描述
解决办法:
给盒子里的icon和文字都加上 user-select: none; 让它们无法被选择

css大概如下:
.node-item {pointer-events: auto;}
.node-item-icon {pointer-events: none;user-select: none;
}
.node-label {user-select: none;pointer-events: none;
}

关于 pointer-events:
CSS的pointer-events属性用于指定什么情况下元素可以成为鼠标事件的target。它常用的关键字有auto和none
pointer-events: auto; 是默认值,鼠标不会穿透当前层。
pointer-events: none; 会让一个元素忽略鼠标操作。

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/156158.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

2014年2月24日 Go生态洞察:FOSDEM 2014上的Go演讲精选

🌷🍁 博主猫头虎(🐅🐾)带您 Go to New World✨🍁 🦄 博客首页——🐅🐾猫头虎的博客🎐 🐳 《面试题大全专栏》 🦕 文章图文…

芯片IO口不加电阻会怎样?

芯片IO口不加电阻会怎样? 可能会导致以下几个后果: 1.高电流问题,IO口没有电阻限流,当与外部设备直接连接时,就可能会导致过大的电流流过IO口,这就可能损坏IO口,引起短路或烧坏其它电路组件。像…

创新无界:通义灵码在测试过程中展现的独特魅力

通义灵码基于通义大模型,提供代码智能生成、研发智能问答能力。本文就来介绍下通义灵码在测试过程中的应用。 操作手册: 通义灵码, 阿里云提供的一款基于通义大模型的智能编码辅助工具_云效-阿里云帮助中心 1. 什么是通义灵码 是阿里云出品的一款基于通…

自己动手打包构建编译cri-dockerd

1.背景 本机是 armv7l架构cpu,发现官方文档中竟然没有,因此需要自己编译下; [rootcontainer0 ~]# uname -a Linux container0 5.4.206-v7l.1.el7 #1 SMP Mon Jul 25 14:13:29 UTC 2022 armv7l armv7l armv7l GNU/Linux2.打包/构建/编译 gi…

RabbitMQ消息队列快速入门

RabbitMQ消息队列快速入门 初始MQ MQ全称为Message Queue,即消息队列,是在消息的传输过程中保存消息的容器。它是典型的生产者-消费者模型。 生产者不断向消息队列中生产消息,消费者不断的从队列中获取消息。消息的生产和消费都是异步的&am…

Java实现围棋算法

围棋是一种源自中国的棋类游戏,也是世界上最古老、最复杂的棋类游戏之一。该游戏由黑白两方交替放置棋子在棋盘上进行,目的是将自己的棋子占据更多的空间,并将对手的棋子围死或吃掉,最终获得胜利。围棋不仅是一种游戏,…

【Node.js】大前端技能最通俗易懂的讲解 快速入门必看

目录 1、概述前端工具VSCode安装 2、NodeJS的安装 3、NodeJS了解和快速入门 4、NodeJS实现HttpServer服务 5、NodeJS实现操作MySQL数据库 Node.js是一个基于Chrome V8引擎的JavaScript运行环境,它允许开发者在服务器端执行Node.js是一个基于Chrome V8引擎的Ja…

01-了解微服务架构的演变过程和微服务技术栈

微服务 微服务架构演变 单体架构:将业务的所有功能集中在一个项目中开发最后打成一个包部署 优点: 架构简单, 部署成本低,适合小型项目缺点: 耦合度高, 升级维护困难 分布式架构:根据业务功能对系统做拆分,每个业务功能模块作为独立项目开发称为一个服务 优点: 降低服务耦合…

金融企业为啥不选择云服务器还是考虑服务器托管

尽管云主机在近年来的发展中取得了巨大的成功,但在金融行业中,一些客户仍然倾向于将服务器托管到数据中心,而不是使用云主机。以下是一些金融客户选择将服务器托管到数据中心的原因: 数据安全性:金融行业对数据的安全性…

Arduino驱动Si7021温湿度传感器(温湿度传感器)

目录 1、传感器特性 2、控制器和传感器连线图 3、驱动程序 Si7021温湿度传感器,应用了专用的数字模块采集技术和温湿度传感技术,具有极高的可靠性与卓越的长期稳定性。同时其体积小巧、精度高,特别是拥有毫秒级测试转换时间(DHT系列需要约2s的转换时间),启动测量与读…

抖音预约服务小程序开发:前端与后端技术的完美融合

开发抖音预约服务小程序成为了一种有趣而又实用的尝试。本篇文章,小编会与大家共同探讨抖音预约服务小程序开发的前端与后端技术融合的关键要点。 一、前端技术选择与设计 1.小程序框架 开发抖音预约服务小程序的前端,首先需要选择一个适用的小程序框…

Ubuntu设设置默认外放和麦克风设备

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言一、pulseaudio 是什么?二、配置外放1.查看所有的外放设备2.设定默认的外放设备3.设定外放设备的声音强度4.设定外放设备静音 三、配置麦克风1.查看…

C#winform门诊医生系统+sqlserver

C#winform门诊医生系统sqlserver说明文档 运行前附加数据库.mdf(或sql生成数据库) 主要技术:基于C#winform架构和sql server数据库 功能模块: 个人中心:修改个人信息、打开照片并进行修改 预约挂号:二级…

轻松驾驭Linux命令:账户查看、目录文件操作详解

🎥 屿小夏 : 个人主页 🔥个人专栏 : Linux系统操作 🌄 莫道桑榆晚,为霞尚满天! 文章目录 📑引言🌤️查看账户☁️whoami☁️who 🌤️ls和目录文件的创建删除☁…

【Spring Boot】如何运用Spring Cache并设置缓存失效时间

简单描述 Spring Cache是一个框架,实现了基于注解的缓存功能,只需要简单地加一个注解,就能实现缓存功能。Spring Cache提供了一层抽象,底层可以切换不同的cache实现。具体就是通过CacheManager接口来统一不同的缓存技术。CacheMan…

JavaScript的学习之BOM和DOM,就这一篇就OK了!(超详细)

目录 Day28 JavaScript(2) 1、BOM对象 1.1 window对象 1.2 Location ( 地址栏)对象 1.3 本地存储对象 2、DOM对象(JS核心) 2.1 查找标签 2.2 绑定事件 2.3 操作标签 2.4 常用事件 Day28 JavaScript(2) 1、BOM对象 BOM:Broswer object model,即浏览器提供我们开发者…

算法学习 day27

第二十七天 美化数组的最少删除数 2216. 美化数组的最少删除数 - 力扣&#xff08;LeetCode&#xff09; class Solution { public:int minDeletion(vector<int>& nums) {int len nums.size();if(len 0) return 0;int res 0,cur 0;for(int i 1;i < len;i)…

企业数字化转型所需的数据在哪里找?企业数据运营有什么用?

现阶段&#xff0c;越来越多企业考虑数字化转型。特别是中小型企业&#xff0c;他们察觉到&#xff1a;数字化转型的关键在于数据的运营。只有通过数据的有效管理和不断挖掘&#xff0c;企业才可以更好地了解市场需求&#xff0c;优化业务流程&#xff0c;提高决策效率&#xf…

[AutoSar]在Davinci developer中mapping Com interface port

目录 关键词平台说明一、实现步骤1.1 新建一个需要接入Com interface 的SWC1.2 Data mapping1.3 选择SWC和信号为分开的还是group1.4 添加前缀后缀1.5 在SWC中使用 关键词 嵌入式、C语言、autosar 平台说明 项目ValueOSautosar OSautosar厂商vector芯片厂商TI编程语言C&…