在第二次拖动项目时出现奇怪的行为react-beautiful dnd
React Beautiful DND是一个用于实现拖放功能的React库。它提供了一组可重用的组件和API，使开发人员能够轻松地在应用程序中实现拖放交互。
React Beautiful DND的主要特点包括：
- 简单易用：React Beautiful DND提供了简单易懂的API和组件，使开发人员能够快速实现拖放功能。
- 高性能：React Beautiful DND经过优化，能够处理大量的拖放操作，并保持良好的性能。
- 可定制性强：React Beautiful DND提供了丰富的配置选项和回调函数，使开发人员能够根据自己的需求自定义拖放交互的行为。
- 跨浏览器支持：React Beautiful DND支持主流的现代浏览器，确保在不同平台上的一致性体验。
React Beautiful DND适用于各种场景，包括但不限于：
- 列表排序：可以使用React Beautiful DND实现列表的拖拽排序功能，例如任务列表、待办事项列表等。
- 拖拽面板：可以使用React Beautiful DND实现拖拽面板，用于创建可自定义布局的仪表盘、面板式应用等。
- 日程安排：可以使用React Beautiful DND实现日程安排功能，允许用户通过拖拽来调整事件的时间和顺序。
- 图片库：可以使用React Beautiful DND实现图片库的拖拽上传和排序功能，方便用户管理和组织图片资源。
腾讯云提供了一系列与云计算相关的产品，其中与React Beautiful DND相结合使用的产品包括：
- 腾讯云对象存储（COS）：腾讯云COS是一种高可用、高可靠、低成本的云端存储服务，可以用于存储React Beautiful DND中拖拽操作涉及的文件和图片。
- 腾讯云函数计算（SCF）：腾讯云SCF是一种事件驱动的无服务器计算服务，可以用于处理React Beautiful DND中的后端逻辑，例如保存拖拽操作的状态或触发其他业务逻辑。
- 腾讯云数据库（TencentDB）：腾讯云数据库提供了多种类型的数据库服务，可以用于存储React Beautiful DND中的数据，例如保存用户的拖拽配置或记录拖拽操作的历史。
更多关于腾讯云相关产品的介绍和详细信息，请访问腾讯云官方网站：https://cloud.tencent.com/
相关·内容
2回答
在第二次拖动项目时出现奇怪的行为react-beautiful dnd
reactjs、firebase-realtime-database、react-beautiful-dnd
由于某些原因，在使用react- reason dnd包时，每秒拖动一次都不能很好地执行(见下图) ? 我的onDragEnd函数如下所示： const onDragEnd = result => { } }); }; 具有返回子组件的getNodes不知道是什么原因造成了这种<em
浏览 18提问于2019-04-04得票数 1
1回答
选择退出"move out of the way“功能？
reactjs、react-beautiful-dnd
我在我的项目中使用react-beautiful dnd。 我正在尝试使两个可拖放的对象交换位置(在可拖放的对象之间)。基本上每个droppable只允许1个draggable。当我将鼠标拖到可拖动对象上时，"move out of the way“功能会一直将它们移开，但我不希望这样。 有没有人知道不把拖拽的东西移走的方法？
浏览 12提问于2019-02-06得票数 0
1回答
react-beautiful dnd:当存在多个列表时，在一行中拖动内容将从所有行中拖动相同的索引
javascript、reactjs、drag-and-drop、draggable、react-beautiful-dnd
我有一个简单的react-beautiful dnd应用程序，其中有多行，您可以在它们自己的行中拖动组件。我的问题是，当我在一行中拖动一个可拖动对象时，内容移动和被拖动组件消失的视觉效果在每一行都会发生。 这是一个演示我的问题的gif： ? 这是一个带有问题交互式演示的codesandbox，并逐步重现了该问
浏览 154提问于2020-01-17得票数 3
回答已采纳
1回答
如何让React组件更具可重用性？
javascript、reactjs、frontend
我一直在学习React，在过去的一个月里一直在做一个项目，但我开始意识到我的组件不一定是“可重用的”。我知道可重用性是React的一个重要概念，但我不知道如何简化我的组件。例如，我有一个使用react-beautiful dnd的待办事项应用程序，它包含三个组件: DragDropContext、Droppable和Draggable。整个应用程序现在包含四个组件:主应用程序组件，它将数据传递给三个react-beautifu
浏览 19提问于2020-06-21得票数 2
1回答
React-beautiful dnd与其他拖拽包的冲突
reactjs、d3.js、material-ui、react-beautiful-dnd
我正在尝试在一个应用程序中同时使用D3、平行圆弧和材料表。每个组件单独运行良好。但是当这些一起呈现时，react- but dnd内部就会发生一个问题。D3平行圆弧在内部使用d3拖拽包，材料表使用react-beautiful dnd包。/></div>
发生的问题如下我
浏览 99提问于2020-05-14得票数 0
1回答
TypeError:无法读取react BeatifulDnD上未定义的属性“”map“”
javascript、reactjs
我正在尝试将React钩子与atlassian/react-beautiful dnd 一起使用我几乎被困在这里了。import React from 'react';
import { DragDropContext, Droppable, Draggable } from 'react-b
浏览 6提问于2019-10-28得票数 0
1回答
当拖动和元素时会出现一些奇怪的样式。
reactjs、react-beautiful-dnd
使用react-beautiful-dnd库，在拖动元素时(在删除它之前)，我的列上会出现一个奇怪的黑点。-
浏览 11提问于2022-11-02得票数 0
1回答
如何使用dnd-list限制“移动”到特定的div (javascript/angular)
javascript、angularjs、drag-and-drop
我使用的是“拖放列表”()。我设置了一个<li> ()，其中每个div包含两个div，如下所示：
<ul dnd-list="models.lists.Aclass="theheader">A header<&#
浏览 1提问于2016-11-16得票数 0
1回答
滚动后不能将项目拖到对话框的末尾-react dnd
javascript、reactjs、react-dnd
当我从对话框中拖放时，react dnd库出现了问题。当我在没有滚动到对话框末尾的情况下拖动项目时，每件事情都能正常工作，另一件奇怪的事情是，这个问题并不存在于Firefox浏览器中，而只存在于chrome浏览器中注意:我在beginDrag和 endDrag 中放了一个endDrag，我发现end
浏览 3提问于2019-12-30得票数 0
回答已采纳
1回答
变化反应-美丽-dnd拖曳点击区
reactjs、draggable、react-beautiful-dnd
我用的是反应-漂亮-dnd例如，可拖放元素具有图标和文本。当我单击元素的任何位置时，默认行为允许我拖动项目。
我需要只点击图标为拖动元素。如何指定拖动元素的单击区域？
浏览 2提问于2020-04-21得票数 11
回答已采纳
1回答
框架运动重新排序不允许拖动的项目滚动容器
reactjs、drag-and-drop、framer-motion
如果查看可滚动列表的框架运动示例，当您将该项拖动到容器视图之外时，容器不会滚动。我正在寻找一种类似于dnd工具包这里的示例的行为。您可以在dnd工具包示例中看到，如果将项目拖到容器之外，则容器将自动滚动。是否有一种方法可以使用重新排序组件在框架运动中复制这种自动滚动行为？
浏览 6提问于2022-04-25得票数 2
1回答
当项目对角向上拖动时，KendoSortable占位符不会出现。
kendo-ui、kendo-sortable
我有两个剑道排序列表，其中我可以拖动多个选定的项目左向右。一切看起来都很好，但我经历了这种奇怪的行为。第二次我拖动对角线向上(东北)，占位符“下降在这里”将不会出现，直到你移动鼠标向下一点。开始拖动“草莓”，然后把“苹果”放到正确的列表上。记住，你的光标应该向东北移动，直到你到达“草莓”的下方。这是我正在使用的<
浏览 2提问于2016-12-07得票数 0
回答已采纳
1回答
HTML5拖放内心的孩子
javascript、html、user-interface
简单的问题是，当使用DnD启用一个元素时，如果您有一个内部子元素(例如一个字体很棒的元素)，那么如果单击内部元素，您似乎无法拖动父元素。这意味着当拖动元素时，用户必须单击子元素周围的填充。以下是我的元素：
<a id="dragme" draggable="true"><i class="fa fa-search"></i><
浏览 2提问于2014-03-13得票数 1
回答已采纳
1回答
react漂亮-dnd不能正确地使用react虚拟化表组件
javascript、reactjs、react-virtualized、react-beautiful-dnd
预期行为实际行为复制步骤您运行的是什么版本的react-beautiful-<em
浏览 8提问于2022-02-14得票数 2
回答已采纳
1回答
jQueryUI可拖动:动态添加的元素出错
javascript、jquery-ui、draggable
我稍微扩展了jQueryUI示例"Draggable + Sortable“( )，使其能够动态添加可拖动元素。在这里可以找到一个活生生的例子：。单击Add按钮后，新的可拖动项将优雅地添加到#sortable列表中。如何修复这种奇怪的行为？如何正确拖拽新增的项目？
浏览 1提问于2011-08-15得票数 0
回答已采纳
1回答
有没有没有拖拽中心点的React DND库？
reactjs、drag-and-drop
我在react组件中搜索了许多支持DND功能的库，但不幸的是，找不到没有中心拖动点的库。所有这些我都看到他们在长卡片内容上有一个问题。我所寻找的是，当开始拖动列表中的项目时，我需要项目根据鼠标指针改变其位置，而不是项目中心点。 有什么建议吗？ 需要覆盖两件事。1)多个目标(任务列表类似于ZendHub) 2)拖动点基于鼠标位置，
浏览 16提问于2019-04-17得票数 0
1回答
在react-beautiful dnd中通过快照时出现typescript类型错误
reactjs、typescript、react-beautiful-dnd
我正在尝试使用react-beautiful dnd创建一个非常简单的、可拖动的元素列表。当我尝试使用快照并分配snapshot.isDragging的值时，我得到一个错误。设置了样式的组件部分正在工作(当我在第31行处理true/false时，我可以看到它改变了颜色) import React, { Component } from "react";
import styledfrom
浏览 62提问于2020-08-29得票数 0
回答已采纳
1回答
如何在使用带有自定义拖动预览的React DnD进行拖放时隐藏元素？
reactjs、react-dnd
我正在使用React DnD来处理React应用程序中的拖放。我正在使用。在这个实现中，我使用了一个自定义的拖动预览。在拖动时，我通过将其最大高度动画设置为0来隐藏“被拖动”的元素。当用户拖动时，将显示自定义拖动预览。如果用户将元素放在不允许的区域中，则“被拖动”项将动画恢复到其原始高度。这很好。当项目被拖放时
浏览 38提问于2017-03-04得票数 0
回答已采纳
1回答
在div中的按钮上使用“'position: div”隐藏按钮
javascript、css、reactjs、draggable
我正在使用draggable-dnd库创建一个kanban board React应用。可拖动的div(或“任务”)是应用程序的一部分，我想添加"X“按钮，以便在单击时删除这些可拖动的div。当我将这些按钮放在可拖动对象的div中时，它们会以正确的功能出现。但是，我想让它们的样式正确地固定在右上角。因此，我尝试添加position:'fixed
浏览 13提问于2021-05-30得票数 0
回答已采纳
1回答
如何访问反应、拖放中拖动的对象字段？
reactjs、react-dnd
所以基本上，我试图在一个简单的游戏中使用dnd，但我觉得我不太明白某些params的意义。我有两个组件被用作源和目标。源正在接收来自父服务器的单元支持，我希望Field组件(目标)知道哪个单元正在被拖动，ATM机和放置后在其中显示它。我已经看到我可以在beginDrag()中指定一些字段，但我认为可能不是它。是可能的，还是有解决办法？/dragTypes/TileTypes";
import { useDrop } fro
浏览 8提问于2020-07-15得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
