使用react可排序自组织拖放tr元素时丢失样式
使用react可排序自组织拖放tr元素时丢失样式
提问于 2020-02-06 10:20:32
我的问题是，所选元素的样式在拖动时丢失。我使用的是反应可排序的临时库，它不提供相关信息。他们的例子没有这个问题。样式始终与原始项目相同。
<tbody>
{items.map((value, index) => (
<SortableItem key={`item-${value.code}`} index={index} sortIndex={index} value={value} />
))}
</tbody>const SortableItem = SortableElement(({value, sortIndex}) => (
<tr>
<DragHandle sortIndex={sortIndex}/>
<td>{value.label}</td>
<td>{value.beta.toString()}</td>
<td>{value.prod.toString()}</td>
<td>{value.hidden.toString()}</td>
</tr>
)); const DragHandle = SortableHandle(({sortIndex}) => <td>{sortIndex}</td>);以下是我在选择和拖动元素之前的列表。
当我选择并开始拖动第一个元素时，这是我的列表。
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-10-20 21:42:46
对我来说，问题在于CSS的层次结构和特性，我定义了与父项目相关的项目样式。就像这样：
.list .item{
...
}但是，在拖动项时，元素不再链接到父类，而是在父类之外成为单独的元素。因此，它失去了它的所有造型！因此，为了解决这个问题，我们可以在全局范围内定义项和父样式，如下所示：
.list{
...
}
.item{
...
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60092651
复制相关文章
相似问题
腾讯云开发者
