Javascript 当react DnD表的特定行开始在antd中拖动时，如何显示工具提示？

我正在一个项目中使用Ant Design的可拖动表。我想要的是，当有人试图拖动该表的前2行时，会出现一个弹出窗口或工具提示或某种警报，告诉您它无法拖动。如果不是这样，至少我希望DragPreview不显示正在进行拖动的动画，这样就可以清楚地看到这些行不是要被拖动的

我尝试了很多方法，但一旦开始拖动过程，就什么都做不了。我特别想在拖动时显示工具提示

以下是指向代码沙箱的链接，以生成最小工作示例：

---

当有人试图拖动表格的前两行时，工具提示应与消息一起显示。

我发现这是向用户显示此

行不可拖动的消息的最快方法

方法1:

.ant-table-body
  tbody[class="ant-table-tbody"]
  tr[style="cursor: default;"]:hover {
  color: red;
}

.ant-table-body
  tbody[class="ant-table-tbody"]
  tr[style="cursor: default;"]:hover
  td:last-child:after {
  color: red;
  content: " THIS ROW IS NOT DRAGGABLE";
  font-size: 16px;
  font-weight: 800;
}

当用户鼠标悬停在不可拖动的行上时，它只会变成红色。你可以定制这个

index.css

.ant-table-body
  tbody[class="ant-table-tbody"]
  tr[style="cursor: default;"]:hover {
  color: red;
}

.ant-table-body
  tbody[class="ant-table-tbody"]
  tr[style="cursor: default;"]:hover
  td:last-child:after {
  color: red;
  content: " THIS ROW IS NOT DRAGGABLE";
  font-size: 16px;
  font-weight: 800;
}

方法2:

当用户鼠标悬停在不可拖动的行上时，它将显示一些消息。您可以根据需要定制此CSS


index.css

.ant-table-body
  tbody[class="ant-table-tbody"]
  tr[style="cursor: default;"]:hover {
  color: red;
}

.ant-table-body
  tbody[class="ant-table-tbody"]
  tr[style="cursor: default;"]:hover
  td:last-child:after {
  color: red;
  content: " THIS ROW IS NOT DRAGGABLE";
  font-size: 16px;
  font-weight: 800;
}

工具提示还是信息？这是两种不同的东西，最好是工具提示。