如何用react js模拟长按？

Question

我想用点击事件触发长按事件。 在 React js 中有什么办法吗？

接近于此的是 jQuery trigger() function。但我想要 trigger("longPress") 之类的东西，或者用左键单击打开右键单击菜单以做出反应。 两者都提到（长按触发器/打开右键单击菜单）对我来说是理想的

Answer 1

你可以通过保持时间来做这个黑客

https://stackblitz.com/edit/react-d1txdm

export default function App() {
  let triggerTime;
  return (
    <div>
      <h1>Try on Google Chrome Desktop</h1>
      <p>Open the console log to see how the event gets triggered.</p>
      <p>The event should not get triggered if there is a long click.</p>
      <img
        src="https://via.placeholder.com/200.png/09f/fff"
        onClick={(e) => {
          if (triggerTime > 1000) return;
          else console.log('normal click');
        }}
        onMouseDown={() => {
          triggerTime = new Date().getTime();
        }}
        onMouseUp={() => {
          let thisMoment = new Date().getTime();
          triggerTime = thisMoment - triggerTime;
        }}
      />
    </div>
  );
}

Answer 2

像这样的东西怎么样：

const myComponent = () => {

    let clickHoldTimer = null;

    const handleMouseDown = () => {
        clickHoldTimer = setTimeout(() => {
            //Action to be performed after holding down mouse
        }, 1000); //Change 1000 to number of milliseconds required for mouse hold
    }

    const handleMouseUp = () => {
        clearTimeout(clickHoldTimer);
    }

    return (
        <div onMouseDown={handleMouseDown} onMouseUp={handleMouseUp} />
    )

}