使用react-resizable，react-drag-listview和AntDesign表仅拖动标题单元格内容的错误

问题描述

我有一个Ant Design表，其中的列可以使用react-resizable调整大小，并可以使用react-drag-listview拖动。

所有功能都可以正常运行，尽管在某些情况下会出现一个错误，这意味着使这些功能协同工作的整个解决方案可能不可行或无法投入生产。

这是正确的行为-单击表格标题单元格时，整个单元格都被拖动，您可以看到框形边框周围的框形阴影，如下所示：

错误在于，有时在调整列的大小然后单击右侧列的标题单元格后，标题单元格不会被拖动，仅内容（在这种情况下为文本）/列标题是这个：

Here is a code sandbox和有关如何重新创建错误的逐步指南：

1. 转到代码沙箱
2. 单击任意列的右边框
3. 拖动该列并向右/增大其大小，直到鼠标位于该列右侧的标题上方，如下所示：

1. 完成此操作后，请向上提起鼠标按钮，然后将其向下压在要悬停的列标题上（即，单击右侧列的标题）
2. 拖动列

有时行为是断断续续的，但很容易重现，如果快速重复这些步骤，则可能更明显。

该错误如何解决？

解决方法

发生此问题是因为默认情况下标题文本是可选的并且可拖动。为dragHandle类和th元素添加以下样式。您将无法选择标题中的文本，但从好的方面来说，该问题将得到解决。

thead tr th,.dragHandler {
  user-select: none;
}

看看更新后的example。