javascript - 如何找到代表其实际 html 元素的 React DOM 节点？

Question

如果您感兴趣，这是我的问题:我想找到用户选择的文本，并在该选择的开始和结束处插入一个标签(以突出显示文本)。

根据 StackOverflow 的顶尖思想引用，找到选择的最佳方法是使用 window.getSelection()。

这与 getRangeAt(0) 相结合，产生了一个列表，其中 startContainer 和 endContainer 看起来特别有前途。 startContainer.parentNode 直接指向我开始选择的 p 标签。太棒了!

但是，我如何真正知道它代表 React DOM 中的哪个元素？我如何操纵正确的东西？

Answer 1

window.addEventListener("mousedown", function(e){console.log(e)});

使用此事件监听器(或更好地使用 mouseup)，您可以找到有关目标的所有数据，例如:如果您将这段代码复制/粘贴到控制台并查看日志，您将找到有关的所有信息此事件包括目标、时间戳、shift 键、控制键、x、y、哪个鼠标按钮以及所有相关信息。如果将其与您之前描述的内容结合起来，您将获得所需的结果