javascript - 如何将函数传播到 div 元素中？

Question

我有一个函数可以处理工具提示的显示/隐藏和位置：

  tooltip = (e) => {
        // show/hide and position of tooltip
        // get element data
      }

还有一个 div 元素，我想在其中传播它：

<div {...tooltip} data='This is a tooltip 1'>Some div</div>
<div {...tooltip} data='This is a tooltip 2>Some div</div>

所以它看起来像：

<div onmouseover=tooltip(e) onmouseleave=tooltip(e) data='This is a tooltip 1'>Some div</div>

怎么做？

score 1 · Accepted Answer

对此没有预先确定的解决方案，因为将相同的处理程序附加到多个事件并不是一项常见的任务。它应该是：

<div onMouseOver={tooltip} onMouseLeave={tooltip}>Some div</div>

如果经常需要这样做，请考虑创建一个助手：

const mouseEnterLeave = fn => ({ onMouseOver: fn, onMouseLeave: fn });

然后可以应用传播属性：

<div {...mouseEnterLeave(tooltip)}>Some div</div>

1 回答 1