当前位置: 首页 > news >正文

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.lryc.cn/news/238473.html

相关文章:

  • el-tree结合el-switch实现状态切换
  • 汽车智能座舱/智能驾驶SOC -1
  • 2023 年爆肝将近 20 万字讲解最新 JavaEE 全栈工程师基础教程(更新中)
  • 目标检测YOLO实战应用案例100讲-基于改进YOLOv5s的道路目标检测(续)
  • Laravel/Lumen 任务调度简易入门说明
  • 目标检测 详解SSD原理,数据处理与复现
  • 智能座舱架构与芯片- (8) 视觉篇
  • uniapp、微信小程序返回上页面刷新数据
  • axios 请求合集
  • 浪潮信息云峦服务器操作系统KeyarchOS体验与实践
  • 将 Spring 微服务与 BI 工具集成:最佳实践
  • 负载均衡Ribbon和Feign的使用与区别
  • Python Opencv实践 - 二维码和条形码识别
  • 树莓派的的串口通信协议
  • DAY60 84.柱状图中最大的矩形
  • 你知道Linux操作系统的前世今生吗?Linux系统又该如何搭建呢?
  • 674. 最长连续递增序列
  • DS5上ARM编译器样例工程改为GCC编译
  • 关于Unity Time.deltaTime的理解和使用
  • Vue3 配置全局 scss 变量
  • 45.120.101.X 如何找出网站建设中弱点和漏洞
  • linux 下打印堆栈信息 jstack pstack gstack 有啥区别?分别的使用场景是啥?
  • Vue 3实战:打造交互丰富的任务管理应用
  • python之列表
  • 想要保护服务器的安全,使用哪个软件比较好?
  • gitlab图形化界面使用
  • Vue使用基本教程(基本介绍及对比,初步使用,构建项目,编辑器等)
  • 基恩士软件的基本操作(四,快速编辑plc技巧)
  • 通达信的ebk文件
  • 城市易涝点怎么安装万宾科技内涝积水监测仪?